完善资源模块

This commit is contained in:
云泽网 2025-05-16 23:56:21 +08:00
parent 02b21dcc6d
commit f6f8f6ac52
21 changed files with 3622 additions and 285 deletions

View File

@ -114,7 +114,7 @@ class Index extends Base{
// 保存附件信息
$fileName = $files->getOriginalName();
$fileSize = $files->getSize();
$attachmentId = $this->saveAttachment($fileName, 1, $fileSize, $img);
$attachmentId = $this->saveAttachment($fileName, 1, $fileSize, $img); // 1: 图片
// 返回成功信息
return json([
@ -132,67 +132,6 @@ class Index extends Base{
return json(['code'=>1, 'msg'=>'上传失败:'.$e->getMessage()])->send();
}
}
# 富文本图片上传
public function upload_imgs(){
$file = request()->file();
$files = request()->file('file');
if(empty($file)){
return json(['code'=>1, 'msg'=>'没有文件上传'])->send();
}
try {
validate(['image'=>'filesize:10240|fileExt:jpg,png,gif,jpeg'])->check($file);
$info = \think\facade\Filesystem::disk('public')->putFile('uploads', $files);
// 处理文件路径
$info = str_replace("\\", "/", $info);
$img = '/storage/'.$info;
// 保存附件信息
$fileName = $files->getOriginalName();
$fileSize = $files->getSize();
$attachmentId = $this->saveAttachment($fileName, 2, $fileSize, $img);
return json([
'code' => 0,
'data' => [
'src' => $img,
'attachment_id' => $attachmentId
]
])->send();
} catch (\think\exception\ValidateException $e) {
return json(['code'=>1, 'msg'=>$e->getMessage()])->send();
}
}
# 富文本图片上传
public function upload_imgs_kin(){
$file = request()->file();
$files = request()->file('imgFile');
if(empty($file)){
return json(['error'=>1, 'message'=>'没有文件上传'])->send();
}
try {
validate(['image'=>'filesize:10240|fileExt:jpg,png,gif,jpeg'])->check($file);
$info = \think\facade\Filesystem::disk('public')->putFile('uploads', $files);
// 处理文件路径
$info = str_replace("\\", "/", $info);
$img = '/storage/'.$info;
// 保存附件信息
$fileName = $files->getOriginalName();
$fileSize = $files->getSize();
$attachmentId = $this->saveAttachment($fileName, 3, $fileSize, $img);
return json([
'error' => 0,
'url' => $img,
'attachment_id' => $attachmentId
])->send();
} catch (\think\exception\ValidateException $e) {
return json(['error'=>1, 'message'=>$e->getMessage()])->send();
}
}
# 清除缓存
public function clear(){
$a = delete_dir_file(Env::get('runtime_path').'cache/');
@ -203,4 +142,105 @@ class Index extends Base{
$this->returnCode(1, '清除缓存失败');
}
}
# 文件上传
public function upload_file(){
$file = request()->file();
$files = request()->file('file');
if(empty($file)){
return json(['code'=>1, 'msg'=>'没有文件上传'])->send();
}
try {
// 只验证文件扩展名,不验证大小
validate([
'file'=>'fileExt:doc,docx,xls,xlsx,ppt,pptx,pdf,txt,zip,rar,7z'
])->check($file);
$info = \think\facade\Filesystem::disk('public')->putFile('uploads/files', $files);
// 处理文件路径
$info = str_replace("\\", "/", $info);
$filePath = '/storage/'.$info;
// 保存附件信息
$fileName = $files->getOriginalName();
$fileSize = $files->getSize();
$attachmentId = $this->saveAttachment($fileName, 2, $fileSize, $filePath); // 2: 文件
return json([
'code' => 0,
'data' => [
'src' => $filePath,
'attachment_id' => $attachmentId
]
])->send();
} catch (\think\exception\ValidateException $e) {
return json(['code'=>1, 'msg'=>$e->getMessage()])->send();
} catch (\Exception $e) {
return json(['code'=>1, 'msg'=>'上传失败:'.$e->getMessage()])->send();
}
}
# 视频上传
public function upload_video(){
$file = request()->file();
$files = request()->file('file');
if(empty($file)){
return json(['code'=>1, 'msg'=>'没有文件上传'])->send();
}
try {
validate(['video'=>'filesize:102400|fileExt:mp4,avi,mov,wmv,flv'])->check($file);
$info = \think\facade\Filesystem::disk('public')->putFile('uploads/videos', $files);
// 处理文件路径
$info = str_replace("\\", "/", $info);
$videoPath = '/storage/'.$info;
// 保存附件信息
$fileName = $files->getOriginalName();
$fileSize = $files->getSize();
$attachmentId = $this->saveAttachment($fileName, 3, $fileSize, $videoPath); // 3: 视频
return json([
'code' => 0,
'data' => [
'src' => $videoPath,
'attachment_id' => $attachmentId
]
])->send();
} catch (\think\exception\ValidateException $e) {
return json(['code'=>1, 'msg'=>$e->getMessage()])->send();
}
}
# 音频上传
public function upload_audio(){
$file = request()->file();
$files = request()->file('file');
if(empty($file)){
return json(['code'=>1, 'msg'=>'没有文件上传'])->send();
}
try {
validate(['audio'=>'filesize:51200|fileExt:mp3,wav,ogg,m4a'])->check($file);
$info = \think\facade\Filesystem::disk('public')->putFile('uploads/audios', $files);
// 处理文件路径
$info = str_replace("\\", "/", $info);
$audioPath = '/storage/'.$info;
// 保存附件信息
$fileName = $files->getOriginalName();
$fileSize = $files->getSize();
$attachmentId = $this->saveAttachment($fileName, 4, $fileSize, $audioPath); // 4: 音频
return json([
'code' => 0,
'data' => [
'src' => $audioPath,
'attachment_id' => $attachmentId
]
])->send();
} catch (\think\exception\ValidateException $e) {
return json(['code'=>1, 'msg'=>$e->getMessage()])->send();
}
}
}

View File

@ -72,7 +72,6 @@ class Resources extends Base
// 格式化时间
$item['create_time'] = date('Y-m-d H:i:s', $item['create_time']);
$item['upload_time'] = $item['upload_time'] ? date('Y-m-d H:i:s', $item['upload_time']) : '';
return $item;
});
@ -125,7 +124,6 @@ class Resources extends Base
'uploader' => input('post.uploader'),
'desc' => input('post.desc'),
'status' => input('post.status', 2),
'upload_time' => time(),
'create_time' => time()
];
@ -149,54 +147,6 @@ class Resources extends Base
}
}
// 编辑资源
public function edit()
{
if (Request::isPost()) {
$id = input('get.id');
$data = [
'name' => input('post.name'),
'cate' => input('post.cate'),
'icon' => input('post.icon'),
'url' => input('post.url'),
'code' => input('post.code'),
'uploader' => input('post.uploader'),
'desc' => input('post.desc'),
'status' => input('post.status', 2),
'update_time' => time()
];
$update = Db::table('yz_resources')->where('id', $id)->update($data);
return json(['code' => $update === false ? 1 : 0, 'msg' => $update === false ? '更新失败' : '更新成功', 'data' => []]);
} else {
$id = input('get.id');
$info = Db::table('yz_resources')->where('id', $id)->find();
if ($info === null) {
return json(['code' => 1, 'msg' => '资源不存在', 'data' => []]);
}
$cates = Db::table('yz_resources_category')
->where('delete_time', null)
->where('status', 1)
->order('sort asc, id asc')
->select()
->toArray();
$currentCate = Db::table('yz_resources_category')
->where('id', $info['cate'])
->where('delete_time', null)
->where('status', 1)
->find();
$info['cate_name'] = $currentCate ? $currentCate['name'] : '';
View::assign([
'info' => $info,
'cates' => $cates
]);
return View::fetch();
}
}
// 删除资源
public function delete()
{
@ -411,4 +361,88 @@ class Resources extends Base
}
return json(['code' => 0, 'msg' => '删除成功', 'data' => []]);
}
/**
* 获取资源详情
*/
public function get()
{
$id = input('id/d', 0);
if (!$id) {
return json(['code' => 1, 'msg' => '参数错误']);
}
$resource = Db::table('yz_resources')
->where('id', $id)
->where('delete_time', null)
->find();
if (!$resource) {
return json(['code' => 1, 'msg' => '资源不存在']);
}
// 获取分类信息
$cateInfo = Db::table('yz_resources_category')
->where('id', $resource['cate'])
->field('name')
->find();
if ($cateInfo) {
$resource['cate_name'] = $cateInfo['name'];
}
// 调试输出
trace('Resource data: ' . json_encode($resource), 'debug');
return json(['code' => 0, 'msg' => '获取成功', 'data' => $resource]);
}
/**
* 编辑资源
*/
public function edit()
{
if (Request::isPost()) {
$data = input('post.');
$id = input('id/d', 0);
if (!$id) {
return json(['code' => 1, 'msg' => '参数错误']);
}
// 更新数据
$result = Db::table('yz_resources')->where('id', $id)->update([
'title' => $data['title'],
'cate' => $data['cate'],
'desc' => $data['desc'],
'uploader' => $data['uploader'],
'icon' => $data['icon'],
'fileurl' => $data['fileurl'],
'url' => $data['url'],
'code' => $data['code'],
'sort' => $data['sort'],
'update_time' => time()
]);
if ($result !== false) {
return json(['code' => 0, 'msg' => '编辑成功']);
} else {
return json(['code' => 1, 'msg' => '编辑失败']);
}
}
$id = input('id/d', 0);
if (!$id) {
$this->error('参数错误');
}
$resource = Db::table('yz_resources')->where('id', $id)->find();
if (!$resource) {
$this->error('资源不存在');
}
View::assign('resource', $resource);
return View::fetch();
}
}

View File

@ -14,15 +14,15 @@
<div class="layui-form-item">
<label class="layui-form-label">资源名称</label>
<div class="layui-input-block">
<input type="text" name="name" required lay-verify="required" placeholder="请输入资源名称" autocomplete="off"
class="layui-input">
<input type="text" name="title" required lay-verify="required" placeholder="请输入资源名称" autocomplete="off"
class="layui-input" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">分类</label>
<div class="layui-input-block">
<select name="cate_id" lay-verify="required">
<select name="cate" lay-verify="required">
<option value="">请选择分类</option>
</select>
</div>
@ -31,15 +31,15 @@
<div class="layui-form-item">
<label class="layui-form-label">描述</label>
<div class="layui-input-block">
<textarea name="desc" placeholder="请输入资源描述" class="layui-textarea"></textarea>
<textarea name="desc" placeholder="请输入资源描述" class="layui-textarea" lay-affix="clear"></textarea>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">上传者</label>
<div class="layui-input-block">
<input type="text" name="uploader" required lay-verify="required" placeholder="请输入上传者" autocomplete="off"
class="layui-input">
<input type="text" name="uploader" required lay-verify="required" placeholder="请输入上传者"
autocomplete="off" class="layui-input" lay-affix="clear">
</div>
</div>
@ -55,7 +55,7 @@
style="width: 118px; height: 118px;object-fit: cover;">
<div id="upload-text"></div>
</div>
<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="filter-demo">
<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="icon-progress">
<div class="layui-progress-bar" lay-percent=""></div>
</div>
<input type="hidden" name="icon" id="icon" value="">
@ -64,26 +64,50 @@
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">资源文件</label>
<div class="layui-input-block">
<input type="text" name="fileurl" required placeholder="本地资源地址" autocomplete="off"
class="layui-input" value="" style="margin-bottom: 10px;" lay-affix="clear">
<div class="layui-upload-drag" style="display: block;" id="ID-upload-demo-drag">
<i class="layui-icon layui-icon-upload"></i>
<div>点击上传,或将文件拖拽到此处</div>
<div class="layui-hide" id="ID-upload-demo-preview">
<hr>
<div class="file-info">
<i class="layui-icon layui-icon-file"></i>
<span class="file-name"></span>
<span class="file-size"></span>
</div>
</div>
</div>
<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="file-progress" style="margin-top: 10px;">
<div class="layui-progress-bar" lay-percent=""></div>
</div>
<input type="hidden" name="file" id="file" value="">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">资源链接</label>
<div class="layui-input-block">
<input type="text" name="url" required lay-verify="required" placeholder="请输入资源链接" autocomplete="off"
class="layui-input">
<input type="text" name="url" required placeholder="百度网盘、115网盘、蓝奏云等" autocomplete="off"
class="layui-input" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">分享码</label>
<div class="layui-input-block">
<input type="text" name="code" required lay-verify="required" placeholder="请输入分享码" autocomplete="off"
class="layui-input">
<input type="text" name="code" required placeholder="请输入分享码" autocomplete="off"
class="layui-input" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">排序</label>
<div class="layui-input-block">
<input type="number" name="sort" value="0" class="layui-input" placeholder="数字越大越靠前">
<input type="number" name="sort" value="0" class="layui-input" placeholder="数字越大越靠前" lay-affix="clear">
</div>
</div>
@ -100,46 +124,89 @@
layui.use(['form', 'layer'], function () {
var form = layui.form;
var layer = layui.layer;
var $ = layui.jquery;
var $ = layui.$;
var upload = layui.upload;
var element = layui.element;
// 图标上传
var uploadInst = upload.render({
var iconUpload = upload.render({
elem: '#upload-btn',
url: '{:url("index/upload_img")}',
before: function (obj) {
obj.preview(function (index, file, result) {
$('#upload-img').attr('src', result);
});
element.progress('filter-demo', '0%');
layer.msg('上传中', { icon: 16, time: 0 });
element.progress('icon-progress', '0%');
layer.msg('图标上传中', { icon: 16, time: 0 });
},
done: function (res) {
if (res.code > 0) {
return layer.msg('上传失败');
return layer.msg('图标上传失败');
}
$('#icon').val(res.data);
$('#upload-text').html('');
layer.msg('上传成功', { icon: 1 });
layer.msg('图标上传成功', { icon: 1 });
},
uploadError: function () {
var demoText = $('#upload-text');
demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
demoText.find('.demo-reload').on('click', function () {
uploadInst.upload();
iconUpload.upload();
});
},
progress: function (n, elem, e) {
element.progress('filter-demo', n + '%');
element.progress('icon-progress', n + '%');
if (n == 100) {
layer.msg('上传完毕', { icon: 1 });
layer.msg('图标上传完毕', { icon: 1 });
}
}
});
// 文件上传
var fileUpload = upload.render({
elem: '#ID-upload-demo-drag',
url: '{:url("index/upload_file")}',
accept: 'file',
exts: 'doc|docx|xls|xlsx|ppt|pptx|pdf|txt|zip|rar|7z',
before: function (obj) {
obj.preview(function (index, file, result) {
$('#ID-upload-demo-preview').show();
$('.file-name').text(file.name);
$('.file-size').text(formatFileSize(file.size));
});
element.progress('file-progress', '0%');
layer.msg('文件上传中', { icon: 16, time: 0 });
},
done: function (res) {
if (res.code > 0) {
return layer.msg('文件上传失败');
}
$('#file').val(res.data.src);
$('input[name="fileurl"]').val(res.data.src);
layer.msg('文件上传成功', { icon: 1 });
},
uploadError: function () {
layer.msg('文件上传失败', { icon: 2 });
},
progress: function (n, elem, e) {
element.progress('file-progress', n + '%');
if (n == 100) {
layer.msg('文件上传完毕', { icon: 1 });
}
}
});
// 格式化文件大小
function formatFileSize(bytes) {
if (bytes === 0) return '0 B';
const k = 1024;
const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
const i = Math.floor(Math.log(bytes) / Math.log(k));
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
}
// 获取分类列表
$.get('{:url("resources/cate")}', function (res) {
$.get('{:url("resources/getcate")}', function (res) {
if (res.code == 0) {
var html = '<option value="">请选择分类</option>';
res.data.forEach(function (item) {
@ -151,7 +218,7 @@
});
}
});
$('select[name="cate_id"]').html(html);
$('select[name="cate"]').html(html);
form.render('select');
} else {
layer.msg(res.msg, { icon: 2 });
@ -179,6 +246,29 @@
});
return false;
});
// 重置按钮点击事件
$('button[type="reset"]').on('click', function() {
// 重新加载分类列表
$.get('{:url("resources/getcate")}', function (res) {
if (res.code == 0) {
var html = '<option value="">请选择分类</option>';
res.data.forEach(function (item) {
var disabled = item.cid == 0 ? 'disabled' : '';
html += '<option value="' + item.id + '" ' + disabled + '>' + item.name + '</option>';
if (item.children && item.children.length > 0) {
item.children.forEach(function (child) {
html += '<option value="' + child.id + '">├─ ' + child.name + '</option>';
});
}
});
$('select[name="cate"]').html(html);
form.render('select');
} else {
layer.msg(res.msg, { icon: 2 });
}
});
});
});
</script>

View File

@ -0,0 +1,332 @@
{include file="public/header" /}
<div class="config-container">
<div class="config-header" style="display:flex;justify-content: space-between;">
<div>
<span>编辑资源</span>
</div>
<div>
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="goBack()">
<i class="layui-icon layui-icon-return"></i>返回
</button>
</div>
</div>
<form class="layui-form" action="" method="post">
<input type="hidden" name="id" value="{$resource.id|default=''}">
<div class="layui-form-item">
<label class="layui-form-label">资源名称</label>
<div class="layui-input-block">
<input type="text" name="title" required lay-verify="required" placeholder="请输入资源名称" autocomplete="off"
class="layui-input" value="{$resource.title|default=''}" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">分类</label>
<div class="layui-input-block">
<select name="cate" lay-verify="required">
<option value="">请选择分类</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">描述</label>
<div class="layui-input-block">
<textarea name="desc" placeholder="请输入资源描述" class="layui-textarea" lay-affix="clear">{$resource.desc|default=''}</textarea>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">上传者</label>
<div class="layui-input-block">
<input type="text" name="uploader" required lay-verify="required" placeholder="请输入上传者"
autocomplete="off" class="layui-input" value="{$resource.uploader|default=''}" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">资源图标</label>
<div class="layui-input-block">
<button type="button" class="layui-btn" id="upload-btn">
<i class="layui-icon layui-icon-upload"></i> 图标上传
</button>
<div style="width: 120px;">
<div class="layui-upload-list">
<img class="layui-upload-img" id="upload-img"
style="width: 118px; height: 118px;object-fit: cover;">
<div id="upload-text"></div>
</div>
<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="icon-progress">
<div class="layui-progress-bar" lay-percent=""></div>
</div>
<input type="hidden" name="icon" id="icon" value="">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸128px * 128px</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">资源文件</label>
<div class="layui-input-block">
<input type="text" name="fileurl" required placeholder="本地资源地址" autocomplete="off"
class="layui-input" value="{$resource.fileurl|default=''}" style="margin-bottom: 10px;" lay-affix="clear">
<div class="layui-upload-drag" style="display: block;" id="ID-upload-demo-drag">
<i class="layui-icon layui-icon-upload"></i>
<div>点击上传,或将文件拖拽到此处</div>
<div class="layui-hide" id="ID-upload-demo-preview">
<hr>
<div class="file-info">
<i class="layui-icon layui-icon-file"></i>
<span class="file-name"></span>
<span class="file-size"></span>
</div>
</div>
</div>
<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="file-progress" style="margin-top: 10px;">
<div class="layui-progress-bar" lay-percent=""></div>
</div>
<input type="hidden" name="file" id="file" value="">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">资源链接</label>
<div class="layui-input-block">
<input type="text" name="url" required placeholder="百度网盘、115网盘、蓝奏云等" autocomplete="off"
class="layui-input" value="{$resource.url|default=''}" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">分享码</label>
<div class="layui-input-block">
<input type="text" name="code" required placeholder="请输入分享码" autocomplete="off"
class="layui-input" value="{$resource.code|default=''}" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">排序</label>
<div class="layui-input-block">
<input type="number" name="sort" value="{$resource.sort|default='0'}" class="layui-input" placeholder="数字越大越靠前" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="formSubmit">立即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</form>
</div>
<script>
layui.use(['form', 'layer'], function () {
var form = layui.form;
var layer = layui.layer;
var $ = layui.$;
var upload = layui.upload;
var element = layui.element;
// 获取资源详情
var resourceId = $('input[name="id"]').val();
var resourceData = null;
if (resourceId) {
$.get('{:url("resources/get")}', {id: resourceId}, function(res) {
if (res.code == 0) {
resourceData = res.data;
console.log('Resource data:', resourceData); // 调试输出
// 设置表单值
$('input[name="title"]').val(resourceData.title || '');
$('select[name="cate"]').val(resourceData.cate || '');
form.render('select'); // 重新渲染select以显示选中值
$('textarea[name="desc"]').val(resourceData.desc || '');
$('input[name="uploader"]').val(resourceData.uploader || '');
$('input[name="url"]').val(resourceData.url || '');
$('input[name="code"]').val(resourceData.code || '');
$('input[name="sort"]').val(resourceData.sort || '0');
$('input[name="icon"]').val(resourceData.icon || '');
$('input[name="file"]').val(resourceData.file || '');
// 设置图标预览
if (resourceData.icon) {
$('#upload-img').attr('src', resourceData.icon);
}
// 设置文件预览
if (resourceData.file) {
$('#ID-upload-demo-preview').show();
$('.file-name').text(resourceData.file_name || '已上传文件');
}
}
});
}
// 图标上传
var iconUpload = upload.render({
elem: '#upload-btn',
url: '{:url("index/upload_img")}',
before: function (obj) {
obj.preview(function (index, file, result) {
$('#upload-img').attr('src', result);
});
element.progress('icon-progress', '0%');
layer.msg('图标上传中', { icon: 16, time: 0 });
},
done: function (res) {
if (res.code > 0) {
return layer.msg('图标上传失败');
}
$('#icon').val(res.data);
$('#upload-text').html('');
layer.msg('图标上传成功', { icon: 1 });
},
uploadError: function () {
var demoText = $('#upload-text');
demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
demoText.find('.demo-reload').on('click', function () {
iconUpload.upload();
});
},
progress: function (n, elem, e) {
element.progress('icon-progress', n + '%');
if (n == 100) {
layer.msg('图标上传完毕', { icon: 1 });
}
}
});
// 文件上传
var fileUpload = upload.render({
elem: '#ID-upload-demo-drag',
url: '{:url("index/upload_file")}',
accept: 'file',
exts: 'doc|docx|xls|xlsx|ppt|pptx|pdf|txt|zip|rar|7z',
before: function (obj) {
obj.preview(function (index, file, result) {
$('#ID-upload-demo-preview').show();
$('.file-name').text(file.name);
$('.file-size').text(formatFileSize(file.size));
});
element.progress('file-progress', '0%');
layer.msg('文件上传中', { icon: 16, time: 0 });
},
done: function (res) {
if (res.code > 0) {
return layer.msg('文件上传失败');
}
$('#file').val(res.data.src);
$('input[name="fileurl"]').val(res.data.src);
layer.msg('文件上传成功', { icon: 1 });
},
uploadError: function () {
layer.msg('文件上传失败', { icon: 2 });
},
progress: function (n, elem, e) {
element.progress('file-progress', n + '%');
if (n == 100) {
layer.msg('文件上传完毕', { icon: 1 });
}
}
});
// 格式化文件大小
function formatFileSize(bytes) {
if (bytes === 0) return '0 B';
const k = 1024;
const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
const i = Math.floor(Math.log(bytes) / Math.log(k));
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
}
// 获取分类列表
$.get('{:url("resources/getcate")}', function (res) {
if (res.code == 0) {
var html = '<option value="">请选择分类</option>';
res.data.forEach(function (item) {
html += '<option value="' + item.id + '">' + item.name + '</option>';
if (item.children && item.children.length > 0) {
item.children.forEach(function (child) {
html += '<option value="' + child.id + '">├─ ' + child.name + '</option>';
});
}
});
$('select[name="cate"]').html(html);
// 如果有资源数据,设置分类值
if (resourceData && resourceData.cate) {
console.log('Setting cate value:', resourceData.cate); // 调试输出
setTimeout(function() {
$('select[name="cate"]').val(resourceData.cate);
form.render('select');
}, 100);
}
} else {
layer.msg(res.msg, { icon: 2 });
}
});
// 表单提交
form.on('submit(formSubmit)', function (data) {
var loadIndex = layer.load(2);
$.ajax({
url: '{:url("resources/edit")}',
type: 'POST',
data: data.field,
success: function (res) {
layer.close(loadIndex);
if (res.code == 0) {
layer.msg(res.msg, { icon: 1 });
setTimeout(function () {
window.location.href = '{:url("resources/lists")}';
}, 1000);
} else {
layer.msg(res.msg, { icon: 2 });
}
}
});
return false;
});
// 重置按钮点击事件
$('button[type="reset"]').on('click', function() {
// 重新加载分类列表
$.get('{:url("resources/getcate")}', function (res) {
if (res.code == 0) {
var html = '<option value="">请选择分类</option>';
res.data.forEach(function (item) {
html += '<option value="' + item.id + '">' + item.name + '</option>';
if (item.children && item.children.length > 0) {
item.children.forEach(function (child) {
html += '<option value="' + child.id + '">├─ ' + child.name + '</option>';
});
}
});
$('select[name="cate"]').html(html);
// 如果有资源数据,设置分类值
if (resourceData && resourceData.cate) {
setTimeout(function() {
$('select[name="cate"]').val(resourceData.cate);
form.render('select');
}, 100);
} else {
form.render('select');
}
} else {
layer.msg(res.msg, { icon: 2 });
}
});
});
});
</script>
<script>
//返回资源列表
function goBack() {
window.location.href = '{:url("resources/lists")}';
}
</script>

View File

@ -91,13 +91,12 @@
method: 'post',
cols: [[
{ field: 'id', title: 'ID', align: 'center', width: 80 },
{ field: 'name', title: '资源名称' },
{ field: 'title', title: '资源名称' },
{ field: 'cate', title: '分类', align: 'center', width: 120 },
{ field: 'icon', title: '图标', templet: '#iconTemplate', align: 'center', width: 100 },
{ field: 'uploader', title: '上传者', align: 'center', width: 100 },
{ field: 'desc', title: '描述', width: 200 },
{ field: 'status', title: '状态', templet: '#statusTemplate', align: 'center', width: 80 },
{ field: 'upload_time', title: '上传时间', align: 'center', width: 160 },
{ title: '操作', toolbar: '#operationBar', align: 'center', width: 150, fixed: 'right' }
]],
page: true,

View File

@ -129,7 +129,6 @@ class Index extends Base
*/
public function bannerlist()
{
// 获取启用状态的banner列表按排序倒序
$bannerList = Db::name('yz_banner')
->where('delete_time', null)
@ -139,4 +138,140 @@ class Index extends Base
return json(['code' => 1, 'msg' => '获取成功', 'banner' => $bannerList]);
}
/**
* 获取资源下载列表
*/
public function resourcesList()
{
// 获取资源分类顶级分类id为2的子分类
$categories = Db::name('yz_resources_category')
->where('cid', 2)
->where('delete_time', null)
->select()
->toArray();
// 组装分类数据
$categoryData = [];
$categoryImageMap = [];
$resourcesByCategory = [];
foreach ($categories as $category) {
$categoryData[] = [
'id' => $category['id'],
'name' => $category['name']
];
$categoryImageMap[$category['id']] = $category['image'] ?? '';
// 获取每个分类下的资源限制8条
$resources = Db::name('yz_resources')
->where('cate', $category['id'])
->where('delete_time', null)
->where('status', 1)
->order('id', 'desc')
->field('id, cate, title, desc, downloads, create_time, icon, views, uploader')
->limit(8)
->select()
->toArray();
// 替换thumbnail为空的资源
foreach ($resources as &$resource) {
if (empty($resource['thumbnail']) && !empty($categoryImageMap[$resource['cate']])) {
$resource['thumbnail'] = $categoryImageMap[$resource['cate']];
}
}
unset($resource);
$resourcesByCategory[$category['id']] = $resources;
}
// 合并所有分类的资源
$allResources = [];
foreach ($resourcesByCategory as $resources) {
$allResources = array_merge($allResources, $resources);
}
// 按上传时间排序
usort($allResources, function($a, $b) {
return $b['create_time'] - $a['create_time'];
});
// 只取最新的8条
$allResources = array_slice($allResources, 0, 8);
return json([
'code' => 1,
'msg' => '获取成功',
'resources' => $allResources,
'categories' => $categoryData
]);
}
/**
* 获取程序下载列表
*/
public function programList()
{
// 获取程序分类顶级分类id为4的子分类
$categories = Db::name('yz_resources_category')
->where('cid', 1)
->where('delete_time', null)
->select()
->toArray();
// 组装分类数据
$categoryData = [];
$categoryImageMap = [];
$programsByCategory = [];
foreach ($categories as $category) {
$categoryData[] = [
'id' => $category['id'],
'name' => $category['name']
];
$categoryImageMap[$category['id']] = $category['image'] ?? '';
// 获取每个分类下的程序限制8条
$programs = Db::name('yz_resources')
->where('cate', $category['id'])
->where('delete_time', null)
->where('status', 1)
->order('id', 'desc')
->field('id, cate, title, desc, downloads, create_time, icon, views, uploader')
->limit(8)
->select()
->toArray();
// 替换thumbnail为空的程序
foreach ($programs as &$program) {
if (empty($program['thumbnail']) && !empty($categoryImageMap[$program['cate']])) {
$program['thumbnail'] = $categoryImageMap[$program['cate']];
}
}
unset($program);
$programsByCategory[$category['id']] = $programs;
}
// 合并所有分类的程序
$allPrograms = [];
foreach ($programsByCategory as $programs) {
$allPrograms = array_merge($allPrograms, $programs);
}
// 按上传时间排序
usort($allPrograms, function($a, $b) {
return $b['create_time'] - $a['create_time'];
});
// 只取最新的8条
$allPrograms = array_slice($allPrograms, 0, 8);
return json([
'code' => 1,
'msg' => '获取成功',
'programs' => $allPrograms,
'categories' => $categoryData
]);
}
}

View File

@ -42,6 +42,48 @@
</div>
</div>
<!-- 资源下载模块 -->
<div class="core-block core-module" id="resourcesDownload" style="order: 3;">
<div class="module-header">
<div>
<div class="ModuleTitle_titleWrapper">
<h3 class="ModuleTitle_title">办公资源</h3>
<div class="tab-container">
<div class="tab-header">
<div class="tab-item active" data-tab="all">全部</div>
<!-- 分类标签将通过JavaScript动态加载 -->
</div>
</div>
</div>
</div>
<div class="more-btn">更多</div>
</div>
<div class="product-list" id="resourcesDownloadList">
<!-- 文章将通过JavaScript动态加载 -->
</div>
</div>
<!-- 程序下载模块 -->
<div class="core-block core-module" id="programDownload" style="order: 3;">
<div class="module-header">
<div>
<div class="ModuleTitle_titleWrapper">
<h3 class="ModuleTitle_title">程序下载</h3>
<div class="tab-container">
<div class="tab-header">
<div class="tab-item active" data-tab="all">全部</div>
<!-- 分类标签将通过JavaScript动态加载 -->
</div>
</div>
</div>
</div>
<div class="more-btn">更多</div>
</div>
<div class="product-list" id="programDownloadList">
<!-- 程序将通过JavaScript动态加载 -->
</div>
</div>
</div>
</main>
@ -108,6 +150,60 @@
});
}
// 加载资源下载
function loadResources() {
fetch('/index/index/resourcesList')
.then(response => response.json())
.then(result => {
if (result.code === 1) {
// 渲染分类标签
if (result.categories) {
renderCategoryTabs(result.categories, 'resourcesDownload');
}
// 渲染资源列表
if (result.resources && result.resources.length > 0) {
// 只取最新的8条
renderResources(result.resources.slice(0, 8), 'resourcesDownloadList');
} else {
showNoData('resourcesDownloadList');
}
} else {
showNoData('resourcesDownloadList');
}
})
.catch(error => {
console.error('请求失败:', error);
showError('resourcesDownloadList');
});
}
// 加载程序下载
function loadPrograms() {
fetch('/index/index/programList')
.then(response => response.json())
.then(result => {
if (result.code === 1) {
// 渲染分类标签
if (result.categories) {
renderCategoryTabs(result.categories, 'programDownload');
}
// 渲染程序列表
if (result.programs && result.programs.length > 0) {
// 只取最新的8条
renderPrograms(result.programs.slice(0, 8), 'programDownloadList');
} else {
showNoData('programDownloadList');
}
} else {
showNoData('programDownloadList');
}
})
.catch(error => {
console.error('请求失败:', error);
showError('programDownloadList');
});
}
// 显示无数据提示
function showNoData(containerId) {
document.getElementById(containerId).innerHTML = '<div class="no-data">暂无数据</div>';
@ -156,11 +252,20 @@
// 获取选中的分类ID
const selectedCategoryId = this.getAttribute('data-tab');
// 重新加载对应分类的文章
if (moduleId === 'opencourse') {
loadCategoryArticles(selectedCategoryId, 'webArticlesList');
} else {
loadCategoryArticles(selectedCategoryId, 'techArticlesList');
// 根据不同模块加载对应数据
switch(moduleId) {
case 'opencourse':
loadCategoryArticles(selectedCategoryId, 'webArticlesList');
break;
case 'techArticles':
loadCategoryArticles(selectedCategoryId, 'techArticlesList');
break;
case 'resourcesDownload':
loadCategoryResources(selectedCategoryId, 'resourcesDownloadList');
break;
case 'programDownload':
loadCategoryPrograms(selectedCategoryId, 'programDownloadList');
break;
}
});
});
@ -258,9 +363,154 @@
`;
}
// 渲染资源列表
function renderResources(resources, containerId) {
const container = document.getElementById(containerId);
if (!container) return;
let html = '';
if (Array.isArray(resources)) {
resources.forEach(resource => {
html += createResourceHtml(resource);
});
}
container.innerHTML = html || '<div class="no-data">暂无数据</div>';
}
// 创建资源HTML
function createResourceHtml(resource) {
if (!resource) return '';
// 格式化日期
const uploadDate = new Date(resource.uploaddate * 1000);
const formattedDate = uploadDate.toLocaleDateString('zh-CN', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
});
// 格式化文件大小
const formatFileSize = (bytes) => {
if (bytes === 0) return '0 B';
const k = 1024;
const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
const i = Math.floor(Math.log(bytes) / Math.log(k));
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
};
return `
<div class="opencourse product-item" onclick="window.open('/index/resource/detail?id=${resource.id || ''}', '_blank')">
<div class="video">
<img src="${resource.thumbnail || '/static/images/default-resource.png'}" alt="" class="cover">
<div class="file-type">${resource.filetype || '未知类型'}</div>
</div>
<div class="introduction">
<div class="title">${resource.title || '无标题'}</div>
<div class="description">${resource.description || '暂无描述'}</div>
<div class="publishdate">${formattedDate}</div>
</div>
<div class="bottom">
<div class="views"><i class="fa-solid fa-eye"></i><span style="margin-left: 5px;">${resource.views || 0}</span></div>
<div class="author"><i class="fa-regular fa-user"></i><span style="margin-left: 5px;">${resource.uploader || '未知作者'}</span></div>
</div>
</div>
`;
}
// 渲染程序列表
function renderPrograms(programs, containerId) {
const container = document.getElementById(containerId);
if (!container) return;
let html = '';
if (Array.isArray(programs)) {
programs.forEach(program => {
html += createProgramHtml(program);
});
}
container.innerHTML = html || '<div class="no-data">暂无数据</div>';
}
// 创建程序HTML
function createProgramHtml(program) {
if (!program) return '';
// 格式化日期
const createDate = new Date(program.create_time * 1000);
const formattedDate = createDate.toLocaleDateString('zh-CN', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
});
return `
<div class="opencourse product-item" onclick="window.open('/index/program/detail?id=${program.id || ''}', '_blank')">
<div class="video">
<img src="${program.icon || '/static/images/default-program.png'}" alt="" class="cover">
</div>
<div class="introduction">
<div class="title">${program.title || '无标题'}</div>
<div class="publishdate">${formattedDate}</div>
</div>
<div class="bottom">
<div class="views"><i class="fa-solid fa-eye"></i><span style="margin-left: 5px;">${program.views || 0}</span></div>
<div class="author"><i class="fa-regular fa-user"></i><span style="margin-left: 5px;">${program.uploader || '未知作者'}</span></div>
</div>
</div>
`;
}
// 加载分类资源
function loadCategoryResources(categoryId, containerId) {
fetch('/index/index/resourcesList')
.then(response => response.json())
.then(result => {
if (result.code === 1) {
if (categoryId === 'all') {
renderResources(result.resources.slice(0, 8), containerId);
} else {
const filteredResources = result.resources.filter(resource => resource.cate == categoryId);
renderResources(filteredResources, containerId);
}
} else {
showNoData(containerId);
}
})
.catch(error => {
console.error('请求失败:', error);
showError(containerId);
});
}
// 加载分类程序
function loadCategoryPrograms(categoryId, containerId) {
fetch('/index/index/programList')
.then(response => response.json())
.then(result => {
if (result.code === 1) {
if (categoryId === 'all') {
renderPrograms(result.programs.slice(0, 8), containerId);
} else {
const filteredPrograms = result.programs.filter(program => program.cate == categoryId);
renderPrograms(filteredPrograms, containerId);
}
} else {
showNoData(containerId);
}
})
.catch(error => {
console.error('请求失败:', error);
showError(containerId);
});
}
// 页面加载完成后执行
document.addEventListener('DOMContentLoaded', function() {
loadWebArticles();
loadTechArticles();
loadResources();
loadPrograms();
});
</script>

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

View File

@ -1,4 +1,4 @@
<?php /*a:1:{s:49:"E:\Demo\PHP\yunzer\app\admin\view\login\index.php";i:1745855804;}*/ ?>
<?php /*a:1:{s:49:"E:\Demo\PHP\yunzer\app\admin\view\login\index.php";i:1747321871;}*/ ?>
<!DOCTYPE html>
<html lang="zh-CN">
@ -25,11 +25,11 @@
<div class="layui-form-item">
<label class="layadmin-user-login-icon layui-icon layui-icon-username" for="account"></label>
<input type="text" id="account" name="account" placeholder="邮箱" class="layui-input"
value="357099073@qq.com">
value="">
</div>
<div class="layui-form-item">
<label class="layadmin-user-login-icon layui-icon layui-icon-password" for="password"></label>
<input type="password" name="password" class="layui-input" placeholder="密码" class="layui-input"
<input type="password" name="password" lay-affix="eye" class="layui-input" placeholder="密码" class="layui-input"
value="">
</div>
<div class="layui-form-item">

View File

@ -0,0 +1,426 @@
<?php /*a:2:{s:52:"E:\Demo\PHP\yunzer\app\admin\view\resources\edit.php";i:1747409592;s:51:"E:\Demo\PHP\yunzer\app\admin\view\public\header.php";i:1746890051;}*/ ?>
<!DOCTYPE html>
<html>
<head>
<title><?php echo htmlentities((string) $config['admin_name']); ?></title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css" media="all"/>
<link rel="stylesheet" type="text/css" href="/static/css/moban.css" media="all"/>
<link rel="stylesheet" type="text/css" href="/static/css/wangeditor.css" media="all"/>
<style type="text/css">
.header span{background:#009688;margin-left:30px;padding:10px;color:#ffffff;}
.header div{border-bottom:solid 2px #009688;margin-top: 8px;}
.header button{float:right;margin-top:-5px;}
.pagination {
display: inline-block;
padding-left: 0;
margin: 20px 0;
border-radius: 4px;
}
.pagination > li {
display: inline;
}
.pagination > li > a,
.pagination > li > span {
position: relative;
float: left;
padding: 6px 12px;
margin-left: -1px;
line-height: 1.42857143;
color: #337ab7;
text-decoration: none;
background-color: #fff;
border: 1px solid #ddd;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
margin-left: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
z-index: 2;
color: #23527c;
background-color: #eee;
border-color: #ddd;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
z-index: 3;
color: #fff;
cursor: default;
background-color: #337ab7;
border-color: #337ab7;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
color: #777;
cursor: not-allowed;
background-color: #fff;
border-color: #ddd;
}
.close-img { background: url(/static/images/close_img.png); background-size: 20px 20px; width:20px; height: 20px; position: absolute; right: 5px; top: 5px; z-index: 2;}
</style>
<script type="text/javascript" src="/static/layui/layui.js"></script>
<script type="text/javascript">
layui.use(['layer','form','table','laydate','element','upload'],function(){
layer = layui.layer; // layui 弹框
form = layui.form; // layui form表单
table = layui.table; // layui 表格
laydate = layui.laydate; // layui 时间框
element = layui.element; // layui element
upload = layui.upload; // layui 上传
$ = layui.jquery; // layui jquery
})
</script>
</head>
<body style="padding:10px; box-sizing: border-box;">
<div class="config-container">
<div class="config-header" style="display:flex;justify-content: space-between;">
<div>
<span>编辑资源</span>
</div>
<div>
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="goBack()">
<i class="layui-icon layui-icon-return"></i>返回
</button>
</div>
</div>
<form class="layui-form" action="" method="post">
<input type="hidden" name="id" value="<?php echo htmlentities((string) (isset($resource['id']) && ($resource['id'] !== '')?$resource['id']:'')); ?>">
<div class="layui-form-item">
<label class="layui-form-label">资源名称</label>
<div class="layui-input-block">
<input type="text" name="title" required lay-verify="required" placeholder="请输入资源名称" autocomplete="off"
class="layui-input" value="<?php echo htmlentities((string) (isset($resource['title']) && ($resource['title'] !== '')?$resource['title']:'')); ?>" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">分类</label>
<div class="layui-input-block">
<select name="cate" lay-verify="required">
<option value="">请选择分类</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">描述</label>
<div class="layui-input-block">
<textarea name="desc" placeholder="请输入资源描述" class="layui-textarea" lay-affix="clear"><?php echo htmlentities((string) (isset($resource['desc']) && ($resource['desc'] !== '')?$resource['desc']:'')); ?></textarea>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">上传者</label>
<div class="layui-input-block">
<input type="text" name="uploader" required lay-verify="required" placeholder="请输入上传者"
autocomplete="off" class="layui-input" value="<?php echo htmlentities((string) (isset($resource['uploader']) && ($resource['uploader'] !== '')?$resource['uploader']:'')); ?>" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">资源图标</label>
<div class="layui-input-block">
<button type="button" class="layui-btn" id="upload-btn">
<i class="layui-icon layui-icon-upload"></i> 图标上传
</button>
<div style="width: 120px;">
<div class="layui-upload-list">
<img class="layui-upload-img" id="upload-img"
style="width: 118px; height: 118px;object-fit: cover;">
<div id="upload-text"></div>
</div>
<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="icon-progress">
<div class="layui-progress-bar" lay-percent=""></div>
</div>
<input type="hidden" name="icon" id="icon" value="">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸128px * 128px</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">资源文件</label>
<div class="layui-input-block">
<input type="text" name="fileurl" required placeholder="本地资源地址" autocomplete="off"
class="layui-input" value="<?php echo htmlentities((string) (isset($resource['fileurl']) && ($resource['fileurl'] !== '')?$resource['fileurl']:'')); ?>" style="margin-bottom: 10px;" lay-affix="clear">
<div class="layui-upload-drag" style="display: block;" id="ID-upload-demo-drag">
<i class="layui-icon layui-icon-upload"></i>
<div>点击上传,或将文件拖拽到此处</div>
<div class="layui-hide" id="ID-upload-demo-preview">
<hr>
<div class="file-info">
<i class="layui-icon layui-icon-file"></i>
<span class="file-name"></span>
<span class="file-size"></span>
</div>
</div>
</div>
<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="file-progress" style="margin-top: 10px;">
<div class="layui-progress-bar" lay-percent=""></div>
</div>
<input type="hidden" name="file" id="file" value="">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">资源链接</label>
<div class="layui-input-block">
<input type="text" name="url" required placeholder="百度网盘、115网盘、蓝奏云等" autocomplete="off"
class="layui-input" value="<?php echo htmlentities((string) (isset($resource['url']) && ($resource['url'] !== '')?$resource['url']:'')); ?>" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">分享码</label>
<div class="layui-input-block">
<input type="text" name="code" required placeholder="请输入分享码" autocomplete="off"
class="layui-input" value="<?php echo htmlentities((string) (isset($resource['code']) && ($resource['code'] !== '')?$resource['code']:'')); ?>" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">排序</label>
<div class="layui-input-block">
<input type="number" name="sort" value="<?php echo htmlentities((string) (isset($resource['sort']) && ($resource['sort'] !== '')?$resource['sort']:'0')); ?>" class="layui-input" placeholder="数字越大越靠前" lay-affix="clear">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="formSubmit">立即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</form>
</div>
<script>
layui.use(['form', 'layer'], function () {
var form = layui.form;
var layer = layui.layer;
var $ = layui.$;
var upload = layui.upload;
var element = layui.element;
// 获取资源详情
var resourceId = $('input[name="id"]').val();
var resourceData = null;
if (resourceId) {
$.get('<?php echo url("resources/get"); ?>', {id: resourceId}, function(res) {
if (res.code == 0) {
resourceData = res.data;
console.log('Resource data:', resourceData); // 调试输出
// 设置表单值
$('input[name="title"]').val(resourceData.title || '');
$('select[name="cate"]').val(resourceData.cate || '');
form.render('select'); // 重新渲染select以显示选中值
$('textarea[name="desc"]').val(resourceData.desc || '');
$('input[name="uploader"]').val(resourceData.uploader || '');
$('input[name="url"]').val(resourceData.url || '');
$('input[name="code"]').val(resourceData.code || '');
$('input[name="sort"]').val(resourceData.sort || '0');
$('input[name="icon"]').val(resourceData.icon || '');
$('input[name="file"]').val(resourceData.file || '');
// 设置图标预览
if (resourceData.icon) {
$('#upload-img').attr('src', resourceData.icon);
}
// 设置文件预览
if (resourceData.file) {
$('#ID-upload-demo-preview').show();
$('.file-name').text(resourceData.file_name || '已上传文件');
}
}
});
}
// 图标上传
var iconUpload = upload.render({
elem: '#upload-btn',
url: '<?php echo url("index/upload_img"); ?>',
before: function (obj) {
obj.preview(function (index, file, result) {
$('#upload-img').attr('src', result);
});
element.progress('icon-progress', '0%');
layer.msg('图标上传中', { icon: 16, time: 0 });
},
done: function (res) {
if (res.code > 0) {
return layer.msg('图标上传失败');
}
$('#icon').val(res.data);
$('#upload-text').html('');
layer.msg('图标上传成功', { icon: 1 });
},
uploadError: function () {
var demoText = $('#upload-text');
demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
demoText.find('.demo-reload').on('click', function () {
iconUpload.upload();
});
},
progress: function (n, elem, e) {
element.progress('icon-progress', n + '%');
if (n == 100) {
layer.msg('图标上传完毕', { icon: 1 });
}
}
});
// 文件上传
var fileUpload = upload.render({
elem: '#ID-upload-demo-drag',
url: '<?php echo url("index/upload_file"); ?>',
accept: 'file',
exts: 'doc|docx|xls|xlsx|ppt|pptx|pdf|txt|zip|rar|7z',
before: function (obj) {
obj.preview(function (index, file, result) {
$('#ID-upload-demo-preview').show();
$('.file-name').text(file.name);
$('.file-size').text(formatFileSize(file.size));
});
element.progress('file-progress', '0%');
layer.msg('文件上传中', { icon: 16, time: 0 });
},
done: function (res) {
if (res.code > 0) {
return layer.msg('文件上传失败');
}
$('#file').val(res.data.src);
$('input[name="fileurl"]').val(res.data.src);
layer.msg('文件上传成功', { icon: 1 });
},
uploadError: function () {
layer.msg('文件上传失败', { icon: 2 });
},
progress: function (n, elem, e) {
element.progress('file-progress', n + '%');
if (n == 100) {
layer.msg('文件上传完毕', { icon: 1 });
}
}
});
// 格式化文件大小
function formatFileSize(bytes) {
if (bytes === 0) return '0 B';
const k = 1024;
const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
const i = Math.floor(Math.log(bytes) / Math.log(k));
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
}
// 获取分类列表
$.get('<?php echo url("resources/getcate"); ?>', function (res) {
if (res.code == 0) {
var html = '<option value="">请选择分类</option>';
res.data.forEach(function (item) {
html += '<option value="' + item.id + '">' + item.name + '</option>';
if (item.children && item.children.length > 0) {
item.children.forEach(function (child) {
html += '<option value="' + child.id + '">├─ ' + child.name + '</option>';
});
}
});
$('select[name="cate"]').html(html);
// 如果有资源数据,设置分类值
if (resourceData && resourceData.cate) {
console.log('Setting cate value:', resourceData.cate); // 调试输出
setTimeout(function() {
$('select[name="cate"]').val(resourceData.cate);
form.render('select');
}, 100);
}
} else {
layer.msg(res.msg, { icon: 2 });
}
});
// 表单提交
form.on('submit(formSubmit)', function (data) {
var loadIndex = layer.load(2);
$.ajax({
url: '<?php echo url("resources/edit"); ?>',
type: 'POST',
data: data.field,
success: function (res) {
layer.close(loadIndex);
if (res.code == 0) {
layer.msg(res.msg, { icon: 1 });
setTimeout(function () {
window.location.href = '<?php echo url("resources/lists"); ?>';
}, 1000);
} else {
layer.msg(res.msg, { icon: 2 });
}
}
});
return false;
});
// 重置按钮点击事件
$('button[type="reset"]').on('click', function() {
// 重新加载分类列表
$.get('<?php echo url("resources/getcate"); ?>', function (res) {
if (res.code == 0) {
var html = '<option value="">请选择分类</option>';
res.data.forEach(function (item) {
html += '<option value="' + item.id + '">' + item.name + '</option>';
if (item.children && item.children.length > 0) {
item.children.forEach(function (child) {
html += '<option value="' + child.id + '">├─ ' + child.name + '</option>';
});
}
});
$('select[name="cate"]').html(html);
// 如果有资源数据,设置分类值
if (resourceData && resourceData.cate) {
setTimeout(function() {
$('select[name="cate"]').val(resourceData.cate);
form.render('select');
}, 100);
} else {
form.render('select');
}
} else {
layer.msg(res.msg, { icon: 2 });
}
});
});
});
</script>
<script>
//返回资源列表
function goBack() {
window.location.href = '<?php echo url("resources/lists"); ?>';
}
</script>

View File

@ -0,0 +1,348 @@
<?php /*a:2:{s:51:"E:\Demo\PHP\yunzer\app\admin\view\resources\add.php";i:1747406940;s:51:"E:\Demo\PHP\yunzer\app\admin\view\public\header.php";i:1746890051;}*/ ?>
<!DOCTYPE html>
<html>
<head>
<title><?php echo htmlentities((string) $config['admin_name']); ?></title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css" media="all"/>
<link rel="stylesheet" type="text/css" href="/static/css/moban.css" media="all"/>
<link rel="stylesheet" type="text/css" href="/static/css/wangeditor.css" media="all"/>
<style type="text/css">
.header span{background:#009688;margin-left:30px;padding:10px;color:#ffffff;}
.header div{border-bottom:solid 2px #009688;margin-top: 8px;}
.header button{float:right;margin-top:-5px;}
.pagination {
display: inline-block;
padding-left: 0;
margin: 20px 0;
border-radius: 4px;
}
.pagination > li {
display: inline;
}
.pagination > li > a,
.pagination > li > span {
position: relative;
float: left;
padding: 6px 12px;
margin-left: -1px;
line-height: 1.42857143;
color: #337ab7;
text-decoration: none;
background-color: #fff;
border: 1px solid #ddd;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
margin-left: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
z-index: 2;
color: #23527c;
background-color: #eee;
border-color: #ddd;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
z-index: 3;
color: #fff;
cursor: default;
background-color: #337ab7;
border-color: #337ab7;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
color: #777;
cursor: not-allowed;
background-color: #fff;
border-color: #ddd;
}
.close-img { background: url(/static/images/close_img.png); background-size: 20px 20px; width:20px; height: 20px; position: absolute; right: 5px; top: 5px; z-index: 2;}
</style>
<script type="text/javascript" src="/static/layui/layui.js"></script>
<script type="text/javascript">
layui.use(['layer','form','table','laydate','element','upload'],function(){
layer = layui.layer; // layui 弹框
form = layui.form; // layui form表单
table = layui.table; // layui 表格
laydate = layui.laydate; // layui 时间框
element = layui.element; // layui element
upload = layui.upload; // layui 上传
$ = layui.jquery; // layui jquery
})
</script>
</head>
<body style="padding:10px; box-sizing: border-box;">
<div class="config-container">
<div class="config-header" style="display:flex;justify-content: space-between;">
<div>
<span>添加资源</span>
</div>
<div>
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="goBack()">
<i class="layui-icon layui-icon-return"></i>返回
</button>
</div>
</div>
<form class="layui-form" action="" method="post">
<div class="layui-form-item">
<label class="layui-form-label">资源名称</label>
<div class="layui-input-block">
<input type="text" name="name" required lay-verify="required" placeholder="请输入资源名称" autocomplete="off"
class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">分类</label>
<div class="layui-input-block">
<select name="cate" lay-verify="required">
<option value="">请选择分类</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">描述</label>
<div class="layui-input-block">
<textarea name="desc" placeholder="请输入资源描述" class="layui-textarea"></textarea>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">上传者</label>
<div class="layui-input-block">
<input type="text" name="uploader" required lay-verify="required" placeholder="请输入上传者"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">资源图标</label>
<div class="layui-input-block">
<button type="button" class="layui-btn" id="upload-btn">
<i class="layui-icon layui-icon-upload"></i> 图标上传
</button>
<div style="width: 120px;">
<div class="layui-upload-list">
<img class="layui-upload-img" id="upload-img"
style="width: 118px; height: 118px;object-fit: cover;">
<div id="upload-text"></div>
</div>
<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="icon-progress">
<div class="layui-progress-bar" lay-percent=""></div>
</div>
<input type="hidden" name="icon" id="icon" value="">
</div>
<div class="layui-form-mid layui-word-aux">建议尺寸128px * 128px</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">资源文件</label>
<div class="layui-input-block">
<div class="layui-upload-drag" style="display: block;" id="ID-upload-demo-drag">
<i class="layui-icon layui-icon-upload"></i>
<div>点击上传,或将文件拖拽到此处</div>
<div class="layui-hide" id="ID-upload-demo-preview">
<hr>
<div class="file-info">
<i class="layui-icon layui-icon-file"></i>
<span class="file-name"></span>
<span class="file-size"></span>
</div>
</div>
</div>
<div class="layui-progress layui-progress-big" lay-showPercent="yes" lay-filter="file-progress" style="margin-top: 10px;">
<div class="layui-progress-bar" lay-percent=""></div>
</div>
<input type="hidden" name="file" id="file" value="">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">资源链接</label>
<div class="layui-input-block">
<input type="text" name="url" required placeholder="百度网盘、115网盘、蓝奏云等" autocomplete="off"
class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">分享码</label>
<div class="layui-input-block">
<input type="text" name="code" required placeholder="请输入分享码" autocomplete="off"
class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">排序</label>
<div class="layui-input-block">
<input type="number" name="sort" value="0" class="layui-input" placeholder="数字越大越靠前">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="formSubmit">立即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</form>
</div>
<script>
layui.use(['form', 'layer'], function () {
var form = layui.form;
var layer = layui.layer;
var $ = layui.$;
var upload = layui.upload;
var element = layui.element;
// 图标上传
var iconUpload = upload.render({
elem: '#upload-btn',
url: '<?php echo url("index/upload_img"); ?>',
before: function (obj) {
obj.preview(function (index, file, result) {
$('#upload-img').attr('src', result);
});
element.progress('icon-progress', '0%');
layer.msg('图标上传中', { icon: 16, time: 0 });
},
done: function (res) {
if (res.code > 0) {
return layer.msg('图标上传失败');
}
$('#icon').val(res.data);
$('#upload-text').html('');
layer.msg('图标上传成功', { icon: 1 });
},
uploadError: function () {
var demoText = $('#upload-text');
demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
demoText.find('.demo-reload').on('click', function () {
iconUpload.upload();
});
},
progress: function (n, elem, e) {
element.progress('icon-progress', n + '%');
if (n == 100) {
layer.msg('图标上传完毕', { icon: 1 });
}
}
});
// 文件上传
var fileUpload = upload.render({
elem: '#ID-upload-demo-drag',
url: '<?php echo url("index/upload_file"); ?>',
accept: 'file',
exts: 'doc|docx|xls|xlsx|ppt|pptx|pdf|txt|zip|rar|7z',
before: function (obj) {
obj.preview(function (index, file, result) {
$('#ID-upload-demo-preview').show();
$('.file-name').text(file.name);
$('.file-size').text(formatFileSize(file.size));
});
element.progress('file-progress', '0%');
layer.msg('文件上传中', { icon: 16, time: 0 });
},
done: function (res) {
if (res.code > 0) {
return layer.msg('文件上传失败');
}
$('#file').val(res.data.src);
layer.msg('文件上传成功', { icon: 1 });
},
uploadError: function () {
layer.msg('文件上传失败', { icon: 2 });
},
progress: function (n, elem, e) {
element.progress('file-progress', n + '%');
if (n == 100) {
layer.msg('文件上传完毕', { icon: 1 });
}
}
});
// 格式化文件大小
function formatFileSize(bytes) {
if (bytes === 0) return '0 B';
const k = 1024;
const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
const i = Math.floor(Math.log(bytes) / Math.log(k));
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
}
// 获取分类列表
$.get('<?php echo url("resources/getcate"); ?>', function (res) {
if (res.code == 0) {
var html = '<option value="">请选择分类</option>';
res.data.forEach(function (item) {
var disabled = item.cid == 0 ? 'disabled' : '';
html += '<option value="' + item.id + '" ' + disabled + '>' + item.name + '</option>';
if (item.children && item.children.length > 0) {
item.children.forEach(function (child) {
html += '<option value="' + child.id + '">├─ ' + child.name + '</option>';
});
}
});
$('select[name="cate"]').html(html);
form.render('select');
} else {
layer.msg(res.msg, { icon: 2 });
}
});
// 表单提交
form.on('submit(formSubmit)', function (data) {
var loadIndex = layer.load(2);
$.ajax({
url: '<?php echo url("resources/add"); ?>',
type: 'POST',
data: data.field,
success: function (res) {
layer.close(loadIndex);
if (res.code == 0) {
layer.msg(res.msg, { icon: 1 });
setTimeout(function () {
window.location.href = '<?php echo url("resources/lists"); ?>';
}, 1000);
} else {
layer.msg(res.msg, { icon: 2 });
}
}
});
return false;
});
});
</script>
<script>
//返回资源列表
function goBack() {
window.location.href = '<?php echo url("resources/lists"); ?>';
}
</script>

View File

@ -1,4 +1,4 @@
<?php /*a:1:{s:49:"E:\Demo\PHP\yunzer\app\admin\view\index\index.php";i:1746796639;}*/ ?>
<?php /*a:1:{s:49:"E:\Demo\PHP\yunzer\app\admin\view\index\index.php";i:1747402501;}*/ ?>
<!DOCTYPE html>
<html>
@ -18,6 +18,43 @@
width: 60px;
background-image: url("/static/images/logob32.jpg");
}
.main-content {
height: 100%;
background: #fff;
}
#mainWorkspace {
height: 100%;
}
#mainTabs.layui-tab {
margin: 0;
height: 100%;
}
.layui-tab-content {
padding: 0;
height: calc(100% - 41px);
}
.layui-tab-item {
height: 100%;
}
.main-iframe {
width: 100%;
height: 100%;
border: none;
/* background-color: #f2f2f2; */
}
.layui-tab-title {
background: #fff;
box-shadow: 0 1px 2px 0 rgba(0,0,0,.1);
}
.layui-tab-title .layui-this:after {
border-bottom-color: #009688;
}
#LAY_app_body {
overflow: hidden;
}
.layui-tab-content .layui-tab-item {
position: relative;
}
</style>
</head>
@ -69,9 +106,20 @@
</div>
<ul class="layui-nav layui-nav-tree" lay-shrink="all" id="LAY-system-side-menu"
lay-filter="layadmin-system-side-menu">
<!-- 固定的工作台菜单项 -->
<li class="layui-nav-item" data-name="index/welcome">
<a href="javascript:;" lay-tips="工作台" lay-direction="2"
onclick="menuFire('index/welcome',1)">
<i class="layui-icon layui-icon-home" style="margin-top: -30px;"></i>
<cite>工作台</cite>
</a>
</li>
<!-- 下面是原有的菜单循环 -->
<?php if(is_array($menu) || $menu instanceof \think\Collection || $menu instanceof \think\Paginator): $i = 0; $__LIST__ = $menu;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$vo): $mod = ($i % 2 );++$i;?>
<li data-name="" data-jump="" class="layui-nav-item">
<a href="javascript:;" lay-tips="<?php echo htmlentities((string) $vo['label']); ?>" lay-direction="2">
<li data-name="<?php echo htmlentities((string) $vo['src']); ?>" data-jump="" class="layui-nav-item">
<!-- 修改一级菜单的点击事件只有当有src时才跳转 -->
<a href="javascript:;" lay-tips="<?php echo htmlentities((string) $vo['label']); ?>" lay-direction="2" <?php if(isset($vo['src']) &&
$vo['src']): ?>onclick="menuFire('<?php echo htmlentities((string) $vo['src']); ?>',1)" <?php endif; ?>>
<i class="layui-icon layui-icons <?php echo htmlentities((string) $vo['icon_class']); ?>"></i>
<cite><?php echo htmlentities((string) $vo['label']); ?></cite>
</a>
@ -102,12 +150,15 @@
</div>
<!-- 主体内容 -->
<div class="layui-body" id="LAY_app_body">
<div class="layadmin-tabsbody-item layui-show">
<div class="layui-fluid">
<div class="layui-card">
<iframe src="<?php echo htmlentities((string) $config['admin_route']); ?>index/welcome" onload="resetMainHeight(this)"
style="width:100%;height:100%;" frameborder="0" scrolling="0"></iframe>
</div>
<div class="main-content">
<!-- 默认工作台界面 -->
<div id="mainWorkspace">
<iframe src="<?php echo htmlentities((string) $config['admin_route']); ?>index/welcome" class="main-iframe" frameborder="0" scrolling="0"></iframe>
</div>
<!-- 动态标签页 -->
<div id="mainTabs" class="layui-tab" lay-allowClose="true" lay-filter="mainTabs" style="margin-top: 10px;">
<ul class="layui-tab-title"></ul>
<div class="layui-tab-content"></div>
</div>
</div>
</div>
@ -125,38 +176,228 @@
$ = layui.jquery;
layer = layui.layer;
setter = layui.setter;
$('#clearcache').on('click', function () {
$.ajax({
url: "<?php echo htmlentities((string) $config['admin_route']); ?>index/clear",
success: function (res) {
if (res.code > 0) {
layer.msg(res.msg, { 'icon': 2 });
} else {
layer.msg(res.msg, { 'icon': 1 });
setTimeout(function () { parent.window.location.reload(); }, 1000);
// 保存标签状态
function saveTabState(layid, title, url) {
var tabState = {
layid: layid,
title: title,
url: url
};
sessionStorage.setItem('currentTab', JSON.stringify(tabState));
}
// 恢复标签状态
function restoreTabState() {
var tabState = sessionStorage.getItem('currentTab');
if (tabState) {
try {
var tab = JSON.parse(tabState);
if (tab.url && tab.title) {
addTab(tab.title, tab.url, tab.layid);
}
} catch (e) {
console.error('Failed to restore tab state:', e);
}
}
}
// 在页面加载完成后执行
$(document).ready(function () {
// 获取URL参数
var urlParams = new URLSearchParams(window.location.search);
var page = urlParams.get('page');
if (page) {
// 如果有page参数加载对应页面到iframe
$('iframe').attr('src', "<?php echo htmlentities((string) $config['admin_route']); ?>" + page);
} else {
// 否则加载默认页面
$('iframe').attr('src', "<?php echo htmlentities((string) $config['admin_route']); ?>index/welcome");
}
// 恢复标签状态
restoreTabState();
});
// 添加或切换到标签页
window.addTab = function(title, url, id) {
var element = layui.element;
var $ = layui.jquery;
var layid = id || url.replace(/\//g, '_');
// 如果是首页/工作台,直接显示主工作区
if(url.indexOf('index/welcome') > -1 || url.indexOf('welcome') > -1) {
$('#mainTabs').hide();
$('#mainWorkspace').show();
$('#mainWorkspace iframe').attr('src', url);
sessionStorage.removeItem('currentTab');
return;
}
// 显示标签区域
$('#mainWorkspace').hide();
$('#mainTabs').show();
// 如果标签已存在,直接切换
if($('.layui-tab-title li[lay-id="'+ layid +'"]').length > 0) {
element.tabChange('mainTabs', layid);
saveTabState(layid, title, url);
return;
}
// 添加新标签
element.tabAdd('mainTabs', {
title: title,
content: '<iframe src="' + url + '" class="main-iframe" frameborder="0"></iframe>',
id: layid
});
// 切换到新标签页
element.tabChange('mainTabs', layid);
// 保存当前标签状态
saveTabState(layid, title, url);
};
// 监听标签切换事件
element.on('tab(mainTabs)', function(data){
var layid = $(this).attr('lay-id');
// 确保当前标签页内容可见
$('.layui-tab-content .layui-tab-item').eq(data.index).addClass('layui-show')
.siblings().removeClass('layui-show');
// 更新保存的标签状态
var title = $(this).text();
var url = $('.layui-tab-content .layui-tab-item').eq(data.index).find('iframe').attr('src');
saveTabState(layid, title, url);
});
// 监听标签删除事件
element.on('tabDelete(mainTabs)', function(data){
// 如果没有标签了,显示工作台
if($('.layui-tab-title li').length === 0) {
$('#mainTabs').hide();
$('#mainWorkspace').show();
sessionStorage.removeItem('currentTab');
}
});
// 左侧菜单点击事件
$('.left-nav #nav li').click(function (event) {
if ($(this).children('.sub-menu').length) {
if ($(this).hasClass('open')) {
$(this).removeClass('open');
$(this).find('.nav_right').html('&#xe697;');
$(this).children('.sub-menu').stop().slideUp();
$(this).siblings().children('.sub-menu').slideUp();
} else {
$(this).addClass('open');
$(this).children('a').find('.nav_right').html('&#xe6a6;');
$(this).children('.sub-menu').stop().slideDown();
$(this).siblings().children('.sub-menu').stop().slideUp();
$(this).siblings().find('.nav_right').html('&#xe697;');
$(this).siblings().removeClass('open');
}
} else {
var url = $(this).children('a').attr('_href');
var title = $(this).children('a').html();
title = title.replace(/<[^>]+>/g, "").trim(); // 移除HTML标签
if (url) {
window.addTab(title, url);
}
}
event.stopPropagation();
})
// 修改resetMainHeight函数
function resetMainHeight(iframe) {
if (!iframe) return;
try {
// 获取视口高度
var clientHeight = document.documentElement.clientHeight;
// 计算iframe应该的高度减去头部和tab标签的高度
var iframeHeight = clientHeight - 60 - 40; // 60px是头部高度40px是tab标签高度
$(iframe).css({
'height': iframeHeight + 'px',
'width': '100%',
'display': 'block'
});
} catch(e) {
console.error('Reset iframe height failed:', e);
}
}
// 在窗口大小改变时重置所有iframe高度
$(window).on('resize', function() {
$('.main-iframe').each(function() {
resetMainHeight(this);
});
return false;
});
});
// 重新设置主操作页面高度
function resetMainHeight(obj) {
// parent 上级
// clientHeight 元素的像素高度,包含元素的高度+内边距,不包含水平滚动条,边框和外边距
var height = parent.document.documentElement.clientHeight - 80;
$(obj).parent('div').height(height);
}
// 菜单点击
function menuFire(obj, num) {
if (num == 1) {
$('iframe').attr('src', "<?php echo htmlentities((string) $config['admin_route']); ?>" + obj);
var title = '';
// 获取菜单标题
$('.layui-nav-item a').each(function() {
if($(this).attr('onclick') && $(this).attr('onclick').indexOf(obj) > -1) {
title = $(this).text().trim();
return false;
}
});
// 如果没找到标题,使用子菜单查找
if(!title) {
$('.layui-nav-child a').each(function() {
if($(this).attr('onclick') && $(this).attr('onclick').indexOf(obj) > -1) {
title = $(this).text().trim();
return false;
}
});
}
// 添加或切换到标签页
window.addTab(title || '新页面', "<?php echo htmlentities((string) $config['admin_route']); ?>" + obj, obj.replace(/\//g, '_'));
// 更新浏览器URL但保持在index页面
window.history.pushState({}, '', "<?php echo htmlentities((string) $config['admin_route']); ?>index/index?page=" + obj);
// 如果是子菜单,确保父菜单展开
if (obj.indexOf('/') > -1) {
var parentMenu = obj.split('/')[0];
$('.layui-nav-item').each(function () {
var menuSrc = $(this).find('a').attr('onclick');
if (menuSrc && menuSrc.indexOf(parentMenu) > -1) {
$(this).addClass('layui-nav-itemed');
}
});
}
}
var width = screen();
if (width < 2) {
shrink();
}
}
// 监听浏览器前进后退按钮
window.addEventListener('popstate', function (event) {
// 获取URL参数
var urlParams = new URLSearchParams(window.location.search);
var page = urlParams.get('page');
if (page) {
// 如果有page参数通过标签系统加载页面
var title = '新页面';
window.addTab(title, "<?php echo htmlentities((string) $config['admin_route']); ?>" + page, page.replace(/\//g, '_'));
} else {
// 否则加载默认页面
element.tabChange('mainTabs', 'welcome');
}
});
// 退出
function logout() {
layer.confirm('确定要退出吗?', {
@ -175,7 +416,7 @@
}
//跳转前端站点
function gotoFront(){
function gotoFront() {
window.open("//<?php echo htmlentities((string) $config['admin_domain']); ?>", "_blank");
}
</script>

View File

@ -0,0 +1,298 @@
<?php /*a:2:{s:53:"E:\Demo\PHP\yunzer\app\admin\view\resources\lists.php";i:1747407920;s:51:"E:\Demo\PHP\yunzer\app\admin\view\public\header.php";i:1746890051;}*/ ?>
<!DOCTYPE html>
<html>
<head>
<title><?php echo htmlentities((string) $config['admin_name']); ?></title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css" media="all"/>
<link rel="stylesheet" type="text/css" href="/static/css/moban.css" media="all"/>
<link rel="stylesheet" type="text/css" href="/static/css/wangeditor.css" media="all"/>
<style type="text/css">
.header span{background:#009688;margin-left:30px;padding:10px;color:#ffffff;}
.header div{border-bottom:solid 2px #009688;margin-top: 8px;}
.header button{float:right;margin-top:-5px;}
.pagination {
display: inline-block;
padding-left: 0;
margin: 20px 0;
border-radius: 4px;
}
.pagination > li {
display: inline;
}
.pagination > li > a,
.pagination > li > span {
position: relative;
float: left;
padding: 6px 12px;
margin-left: -1px;
line-height: 1.42857143;
color: #337ab7;
text-decoration: none;
background-color: #fff;
border: 1px solid #ddd;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
margin-left: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
z-index: 2;
color: #23527c;
background-color: #eee;
border-color: #ddd;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
z-index: 3;
color: #fff;
cursor: default;
background-color: #337ab7;
border-color: #337ab7;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
color: #777;
cursor: not-allowed;
background-color: #fff;
border-color: #ddd;
}
.close-img { background: url(/static/images/close_img.png); background-size: 20px 20px; width:20px; height: 20px; position: absolute; right: 5px; top: 5px; z-index: 2;}
</style>
<script type="text/javascript" src="/static/layui/layui.js"></script>
<script type="text/javascript">
layui.use(['layer','form','table','laydate','element','upload'],function(){
layer = layui.layer; // layui 弹框
form = layui.form; // layui form表单
table = layui.table; // layui 表格
laydate = layui.laydate; // layui 时间框
element = layui.element; // layui element
upload = layui.upload; // layui 上传
$ = layui.jquery; // layui jquery
})
</script>
</head>
<body style="padding:10px; box-sizing: border-box;">
<div class="config-container">
<!-- 页面头部样式 -->
<div class="config-header" style="display: flex;flex-direction: column;flex-wrap: wrap;align-items: flex-start;">
<div class="maintitle">
<i class="layui-icon layui-icon-file"></i>
<span>资源列表</span>
</div>
<div style="display: flex;align-items: flex-start;flex-direction: column;gap: 15px;margin-bottom: 10px;">
<div class="shaixuan">
<label>筛选:</label>
<div class="layui-form" style="display: flex; gap: 10px;">
<div class="layui-input-inline">
<select id="categoryFilter" lay-filter="categoryFilter" lay-verify="">
<option value="">全部分类</option>
<?php if(is_array($categories) || $categories instanceof \think\Collection || $categories instanceof \think\Paginator): $i = 0; $__LIST__ = $categories;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$category): $mod = ($i % 2 );++$i;?>
<optgroup label="<?php echo htmlentities((string) $category['name']); ?>">
<?php if(is_array($category['children']) || $category['children'] instanceof \think\Collection || $category['children'] instanceof \think\Paginator): $i = 0; $__LIST__ = $category['children'];if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$subCategory): $mod = ($i % 2 );++$i;?>
<option value="<?php echo htmlentities((string) $subCategory['id']); ?>"><?php echo htmlentities((string) $subCategory['name']); ?></option>
<?php endforeach; endif; else: echo "" ;endif; ?>
</optgroup>
<?php endforeach; endif; else: echo "" ;endif; ?>
</select>
</div>
<div class="layui-input-inline">
<input type="text" id="nameSearch" placeholder="搜索资源名称" class="layui-input">
</div>
<div class="layui-input-inline">
<input type="text" id="uploaderSearch" placeholder="搜索上传者" class="layui-input">
</div>
<button type="button" class="layui-btn layui-btn-normal" onclick="doSearch()">
<i class="layui-icon layui-icon-search"></i>搜索
</button>
<button type="button" class="layui-btn layui-btn-primary layui-border-blue" onclick="doRefresh()">
<i class="layui-icon layui-icon-refresh"></i>重置
</button>
</div>
</div>
<div>
<button type="button" class="layui-btn layui-btn-normal" onclick="add()">
<i class="layui-icon layui-icon-add-1"></i>添加资源
</button>
<button type="button" class="layui-btn layui-btn-primary layui-border-blue" onclick="refresh()">
<i class="layui-icon layui-icon-refresh"></i>刷新
</button>
</div>
</div>
</div>
<table id="resourceTable" lay-filter="resourceTable"></table>
</div>
<script type="text/html" id="iconTemplate">
{{# if(d.icon){ }}
<img src="{{ d.icon }}" style="max-width: 50px; max-height: 50px;">
{{# } }}
</script>
<script type="text/html" id="statusTemplate">
{{# if(d.status === 0){ }}
<span style="color:red;">未审核</span>
{{# } else if(d.status === 1){ }}
<span style="color:orange;">待审核</span>
{{# } else if(d.status === 2){ }}
<span style="color:green;">已发布</span>
{{# } else if(d.status === 3){ }}
<span style="color:gray;">已下架</span>
{{# } }}
</script>
<script type="text/html" id="operationBar">
<button type="button" class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit">
<i class="layui-icon layui-icon-edit"></i>编辑
</button>
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" lay-event="del">
<i class="layui-icon layui-icon-delete"></i>删除
</button>
</script>
<script type="text/javascript">
layui.use(['layer', 'form', 'table'], function () {
var layer = layui.layer;
var $ = layui.jquery;
var form = layui.form;
var table = layui.table;
// 初始化表格
table.render({
elem: '#resourceTable',
url: '/admin/resources/lists',
method: 'post',
cols: [[
{ field: 'id', title: 'ID', align: 'center', width: 80 },
{ field: 'title', title: '资源名称' },
{ field: 'cate', title: '分类', align: 'center', width: 120 },
{ field: 'icon', title: '图标', templet: '#iconTemplate', align: 'center', width: 100 },
{ field: 'uploader', title: '上传者', align: 'center', width: 100 },
{ field: 'desc', title: '描述', width: 200 },
{ field: 'status', title: '状态', templet: '#statusTemplate', align: 'center', width: 80 },
{ title: '操作', toolbar: '#operationBar', align: 'center', width: 150, fixed: 'right' }
]],
page: true,
limit: 10,
limits: [10, 50, 100],
//height: 'full-220'
});
// 监听工具条事件
table.on('tool(resourceTable)', function (obj) {
var data = obj.data;
if (obj.event === 'edit') {
edit(data.id);
} else if (obj.event === 'del') {
del(data.id);
}
});
// 监听分类筛选变化
form.on('select(categoryFilter)', function (data) {
filterByCategory(data.value);
});
});
function filterByCategory(categoryId) {
reloadTable();
}
function doSearch() {
var nameKeyword = $('#nameSearch').val().trim();
var uploaderKeyword = $('#uploaderSearch').val().trim();
if (!nameKeyword && !uploaderKeyword && !$('#categoryFilter').val()) {
layer.msg('请输入搜索条件', { icon: 0 });
return;
}
reloadTable();
}
function doRefresh() {
// 清空搜索条件
$('#nameSearch').val('');
$('#uploaderSearch').val('');
$('#categoryFilter').val('');
layui.form.render('select'); // 重新渲染select
// 重新加载表格,不带任何筛选条件
layui.table.reload('resourceTable', {
where: {},
page: {
curr: 1
}
});
layer.msg('已重置', { icon: 1 });
}
function reloadTable() {
var categoryId = $('#categoryFilter').val();
var categoryName = categoryId ? $('#categoryFilter option[value="' + categoryId + '"]').text() : '';
var nameKeyword = $('#nameSearch').val().trim();
var uploaderKeyword = $('#uploaderSearch').val().trim();
layui.table.reload('resourceTable', {
where: {
category: categoryName,
name: nameKeyword,
uploader: uploaderKeyword
},
page: {
curr: 1
}
});
}
function add() {
window.location.href = '/admin/resources/add';
}
function edit(id) {
window.location.href = '/admin/resources/edit?id=' + id;
}
function del(id) {
layer.confirm('确定要删除该资源吗?', {
btn: ['确定', '取消']
}, function () {
$.post('/admin/resources/delete', { id: id }, function (res) {
if (res.code == 0) {
layer.msg(res.msg, { icon: 1 });
setTimeout(function () {
layui.table.reload('resourceTable');
}, 1000);
} else {
layer.msg(res.msg, { icon: 2 });
}
});
});
}
function refresh() {
layui.table.reload('resourceTable');
}
</script>

View File

@ -0,0 +1,619 @@
<?php /*a:2:{s:52:"E:\Demo\PHP\yunzer\app\admin\view\resources\cate.php";i:1747402501;s:51:"E:\Demo\PHP\yunzer\app\admin\view\public\header.php";i:1746890051;}*/ ?>
<!DOCTYPE html>
<html>
<head>
<title><?php echo htmlentities((string) $config['admin_name']); ?></title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css" media="all"/>
<link rel="stylesheet" type="text/css" href="/static/css/moban.css" media="all"/>
<link rel="stylesheet" type="text/css" href="/static/css/wangeditor.css" media="all"/>
<style type="text/css">
.header span{background:#009688;margin-left:30px;padding:10px;color:#ffffff;}
.header div{border-bottom:solid 2px #009688;margin-top: 8px;}
.header button{float:right;margin-top:-5px;}
.pagination {
display: inline-block;
padding-left: 0;
margin: 20px 0;
border-radius: 4px;
}
.pagination > li {
display: inline;
}
.pagination > li > a,
.pagination > li > span {
position: relative;
float: left;
padding: 6px 12px;
margin-left: -1px;
line-height: 1.42857143;
color: #337ab7;
text-decoration: none;
background-color: #fff;
border: 1px solid #ddd;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
margin-left: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
z-index: 2;
color: #23527c;
background-color: #eee;
border-color: #ddd;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
z-index: 3;
color: #fff;
cursor: default;
background-color: #337ab7;
border-color: #337ab7;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
color: #777;
cursor: not-allowed;
background-color: #fff;
border-color: #ddd;
}
.close-img { background: url(/static/images/close_img.png); background-size: 20px 20px; width:20px; height: 20px; position: absolute; right: 5px; top: 5px; z-index: 2;}
</style>
<script type="text/javascript" src="/static/layui/layui.js"></script>
<script type="text/javascript">
layui.use(['layer','form','table','laydate','element','upload'],function(){
layer = layui.layer; // layui 弹框
form = layui.form; // layui form表单
table = layui.table; // layui 表格
laydate = layui.laydate; // layui 时间框
element = layui.element; // layui element
upload = layui.upload; // layui 上传
$ = layui.jquery; // layui jquery
})
</script>
</head>
<body style="padding:10px; box-sizing: border-box;">
<div class="config-container">
<!-- 页面头部样式 -->
<div class="config-header" style="display: flex;flex-direction: column;flex-wrap: wrap;align-items: flex-start;">
<div class="maintitle">
<i class="layui-icon layui-icon-app"></i>
<span>资源分类管理</span>
</div>
<div style="display: flex;align-items: flex-start;flex-direction: column;gap: 15px;margin-bottom: 10px;">
<div>
<button type="button" class="layui-btn layui-btn-normal" onclick="add()">
<i class="layui-icon layui-icon-add-1"></i>添加分类
</button>
<button type="button" class="layui-btn layui-btn-primary layui-border-blue" onclick="refresh()">
<i class="layui-icon layui-icon-refresh"></i>刷新
</button>
</div>
</div>
</div>
<!-- 主要内容区 -->
<div class="main-content">
<div class="layui-row layui-col-space20">
<!-- 左侧分类列表 -->
<div class="layui-col-md7">
<div class="layui-card">
<div class="layui-card-header">
<span>分类列表</span>
<small class="text-muted">支持两级分类结构</small>
</div>
<div class="layui-card-body">
<div id="categoryList" class="category-tree"></div>
</div>
</div>
</div>
<!-- 右侧分类信息 -->
<div class="layui-col-md5">
<div class="layui-card">
<div class="layui-card-header">
<span>分类信息</span>
</div>
<div class="layui-card-body">
<!-- 默认提示 -->
<div id="defaultTip" class="empty-tip">
<i class="layui-icon layui-icon-face-surprised"></i>
<p>请选择左侧分类或点击新增按钮</p>
</div>
<!-- 分类表单 -->
<form class="layui-form category-form" lay-filter="categoryForm" style="display: none;">
<input type="hidden" name="id" id="categoryId">
<div class="layui-form-item">
<label class="layui-form-label">分类名称</label>
<div class="layui-input-block">
<input type="text" name="name" required lay-verify="required" placeholder="请输入分类名称"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">父级分类</label>
<div class="layui-input-block">
<select name="cid" lay-verify="required">
<option value="0">顶级分类</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">分类图标</label>
<div class="layui-input-block">
<div class="layui-upload-drag" id="uploadImage">
<i class="layui-icon layui-icon-upload"></i>
<p>点击上传或拖拽图片至此处</p>
<div class="layui-hide" id="uploadPreview">
<hr>
<img src="" alt="分类图标" style="max-width: 100%">
</div>
</div>
<input type="hidden" name="icon" id="imageInput">
<div class="layui-form-mid layui-word-aux">建议尺寸128px * 128px</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">排序</label>
<div class="layui-input-block">
<input type="number" name="sort" value="0" class="layui-input"
placeholder="数字越大越靠前">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">状态</label>
<div class="layui-input-block">
<input type="radio" name="status" value="1" title="正常" checked>
<input type="radio" name="status" value="0" title="禁用">
</div>
</div>
<div class="layui-form-item form-actions">
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="saveCategory">保存</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
<button type="button" class="layui-btn layui-btn-danger" id="deleteBtn"
style="display: none;">删除</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<style>
/* 页面整体样式 */
.config-container {
padding: 15px;
/* background: #f2f2f2; */
}
.layui-col-md7 .layui-btn-primary {
border-color: #d2d2d2;
background: 0 0;
color: #5f5f5f
}
.layui-col-md7 .layui-btn-primary:hover {
background-color: #1e9fff;
color: #efefef
}
/* 页面头部样式 */
.page-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 15px;
padding: 10px 15px;
background: #fff;
border-radius: 2px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.header-title {
display: flex;
align-items: center;
font-size: 16px;
font-weight: 500;
}
.header-title .layui-icon {
margin-right: 8px;
font-size: 18px;
}
.header-actions .layui-btn {
margin-left: 8px;
}
/* 主要内容区样式 */
.main-content {
min-height: calc(100vh - 170px);
}
.layui-card {
margin-bottom: 0;
border-radius: 8px;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
}
.layui-card-header {
display: flex;
align-items: center;
height: auto;
padding: 12px 15px;
font-size: 15px;
font-weight: 500;
}
.text-muted {
margin-left: 10px;
font-size: 12px;
font-weight: normal;
color: #999;
}
/* 分类树样式 */
.category-tree {
padding: 10px 0;
}
.category-item {
margin: 5px 0;
}
.category-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 15px;
background-color: #f8f8f8;
border-radius: 2px;
transition: all 0.3s;
cursor: pointer;
}
.category-header:hover {
background-color: #f2f2f2;
}
.category-header.active {
background-color: #e6f7ff;
border-right: 3px solid #1890ff;
}
.category-name {
flex: 1;
font-size: 14px;
}
.category-actions {
/* opacity: 0; */
transition: opacity 0.3s;
}
.category-header:hover .category-actions {
opacity: 1;
}
.category-children {
margin-left: 20px;
padding-left: 15px;
border-left: 1px dashed #e6e6e6;
}
.add-child {
padding: 3px 8px;
font-size: 12px;
}
.add-child .layui-icon {
font-size: 12px;
margin-right: 3px;
}
/* 空状态提示 */
.empty-tip {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 40px 0;
color: #999;
}
.empty-tip .layui-icon {
font-size: 32px;
margin-bottom: 10px;
}
/* 表单样式优化 */
.category-form {
padding: 10px 0;
}
.layui-form-label {
width: 100px;
}
.layui-input-block {
margin-left: 130px;
}
.form-actions {
margin-top: 30px;
}
.layui-upload-drag {
padding: 20px;
border: 1px dashed #e2e2e2;
background-color: #fff;
text-align: center;
cursor: pointer;
}
.layui-upload-drag:hover {
border-color: #009688;
}
.layui-upload-drag img {
max-width: 100%;
margin: 10px 0;
}
.layui-btn-xs {
height: 30px;
line-height: 25px;
font-size: 12px;
}
</style>
<script>
// 定义全局变量和函数
var categoryManager = {
init: function () {
this.initLayui();
},
initLayui: function () {
var that = this;
layui.use(['layer', 'form', 'upload'], function () {
var layer = layui.layer;
var form = layui.form;
var upload = layui.upload;
var $ = layui.jquery;
// 初始化分类列表
that.initCategoryList = function () {
$.ajax({
url: '/admin/resources/cate',
type: 'POST',
success: function (res) {
if (res.code === 0) {
var html = '';
res.data.forEach(function (item) {
html += that.renderCategory(item);
});
$('#categoryList').html(html);
that.bindEvents();
} else {
layer.msg('获取分类数据失败', { icon: 2 });
}
}
});
};
// 渲染分类项
that.renderCategory = function (category, level = 0) {
var html = '<div class="category-item" data-id="' + category.id + '">';
html += '<div class="category-header">';
html += '<div class="category-name">' + category.title + '</div>';
if (level === 0) {
html += '<div class="category-actions">';
html += '<button type="button" class="layui-btn layui-btn-primary layui-btn-xs add-child">';
html += '<i class="layui-icon layui-icon-add-1"></i>添加子分类</button>';
html += '</div>';
}
html += '</div>';
if (category.children && category.children.length > 0) {
html += '<div class="category-children">';
category.children.forEach(function (child) {
html += that.renderCategory(child, level + 1);
});
html += '</div>';
}
html += '</div>';
return html;
};
// 绑定事件
that.bindEvents = function () {
// 点击分类项加载编辑信息
$('.category-header').off('click').on('click', function (e) {
if (!$(e.target).closest('.add-child').length) {
var id = $(this).closest('.category-item').data('id');
that.loadCategoryInfo(id);
// 添加选中效果
$('.category-header').removeClass('active');
$(this).addClass('active');
}
});
// 添加子分类
$('.add-child').off('click').on('click', function (e) {
e.stopPropagation();
var parentId = $(this).closest('.category-item').data('id');
that.showCategoryForm(parentId);
});
};
// 加载分类信息
that.loadCategoryInfo = function (id) {
$.get('/admin/resources/cateedit?id=' + id, function (res) {
if (res.code === 0) {
that.showCategoryForm(0, res.data);
}
});
};
// 显示分类表单
that.showCategoryForm = function (parentId = 0, data = null) {
$('#defaultTip').hide();
$('.category-form').show();
// 重置表单
form.val('categoryForm', {
id: data ? data.info.id : '',
name: data ? data.info.name : '',
cid: data ? data.info.cid : parentId,
sort: data ? data.info.sort : 0,
status: data ? data.info.status : 1
});
// 更新父级分类选项
var $select = $('select[name="cid"]');
$select.empty().append('<option value="0">顶级分类</option>');
// 获取所有分类作为父级选项
$.ajax({
url: '/admin/resources/cate',
type: 'POST',
async: false,
success: function (res) {
if (res.code === 0) {
// 当前编辑的分类ID
var currentId = data ? data.info.id : 0;
// 递归构建分类选项
function buildOptions(categories, level) {
categories.forEach(function (category) {
// 不能选择自己或自己的子分类作为父级
if (category.id != currentId) {
var prefix = new Array(level + 1).join('├─ ');
$select.append('<option value="' + category.id + '">' + prefix + category.title + '</option>'); if (category.children && category.children.length > 0) { buildOptions(category.children, level + 1); }
}
});
} buildOptions(res.data, 0);
}
}
});
// 设置选中的父级分类
if (data && data.info.cid) {
$select.val(data.info.cid);
}
// 更新图标预览
if (data && data.info.icon) {
$('#uploadPreview').removeClass('layui-hide').find('img').attr('src', data.info.icon);
$('#imageInput').val(data.info.icon);
} else {
$('#uploadPreview').addClass('layui-hide').find('img').attr('src', '');
$('#imageInput').val('');
}
// 显示/隐藏删除按钮
$('#deleteBtn')[data ? 'show' : 'hide']();
form.render();
};
// 初始化上传组件
upload.render({
elem: '#uploadImage',
url: '/admin/upload/image',
accept: 'images',
acceptMime: 'image/*',
done: function (res) {
if (res.code === 0) {
$('#uploadPreview').removeClass('layui-hide').find('img').attr('src', res.data.url);
$('#imageInput').val(res.data.url);
layer.msg('上传成功');
} else {
layer.msg('上传失败');
}
}
});
// 监听表单提交
form.on('submit(saveCategory)', function (data) {
var url = data.field.id ? '/admin/resources/cateedit' : '/admin/resources/cateadd';
$.post(url, data.field, function (res) {
if (res.code === 0) {
layer.msg(res.msg, { icon: 1 });
that.initCategoryList();
} else {
layer.msg(res.msg, { icon: 2 });
}
});
return false;
});
// 监听删除按钮
$('#deleteBtn').on('click', function () {
var id = $('#categoryId').val();
if (!id) return;
layer.confirm('确定要删除该分类吗?', function (index) {
$.post('/admin/resources/catedel', { id: id }, function (res) {
if (res.code === 0) {
layer.msg(res.msg, { icon: 1 });
that.initCategoryList();
$('#defaultTip').show();
$('.category-form').hide();
} else {
layer.msg(res.msg, { icon: 2 });
}
});
layer.close(index);
});
});
// 初始化页面
that.initCategoryList();
});
}
};
// 初始化
categoryManager.init();
// 新增分类
function add() {
categoryManager.showCategoryForm();
}
// 刷新列表
function refresh() {
categoryManager.initCategoryList();
}
</script>

View File

@ -1,4 +1,4 @@
<?php /*a:4:{s:49:"E:\Demo\PHP\yunzer\app\index\view\index\index.php";i:1746890051;s:54:"E:\Demo\PHP\yunzer\app\index\view\component\header.php";i:1746796639;s:52:"E:\Demo\PHP\yunzer\app\index\view\component\main.php";i:1747316984;s:54:"E:\Demo\PHP\yunzer\app\index\view\component\footer.php";i:1746796639;}*/ ?>
<?php /*a:4:{s:49:"E:\Demo\PHP\yunzer\app\index\view\index\index.php";i:1746890051;s:54:"E:\Demo\PHP\yunzer\app\index\view\component\header.php";i:1747402501;s:52:"E:\Demo\PHP\yunzer\app\index\view\component\main.php";i:1747410946;s:54:"E:\Demo\PHP\yunzer\app\index\view\component\footer.php";i:1747402501;}*/ ?>
<!DOCTYPE html>
<html>
@ -21,17 +21,24 @@
<div class="container">
<div style="width: 70%;">
<ul class="list-unstyled topbar-one__info">
<li class="topbar-one__info__item"><span class="topbar-one__info__icon fas fa-phone-alt"></span><a
href="tel:629-555-0129">(629) 555-0129</a></li>
<li class="topbar-one__info__item"><span class="topbar-one__info__icon fas fa-envelope"></span><a
href="mailto:info@example.com">info@example.com</a></li>
<li class="topbar-one__info__item">
<span class="topbar-one__info__icon fas fa-phone-alt" style="margin-right: 10px;"></span>
<a href="<?php echo htmlentities((string) $config['admin_phone']); ?>"><?php echo htmlentities((string) $config['admin_phone']); ?></a>
</li>
<li class="topbar-one__info__item">
<span class="topbar-one__info__icon fas fa-envelope" style="margin-right: 10px;"></span>
<a href="mailto:<?php echo htmlentities((string) $config['admin_email']); ?>"><?php echo htmlentities((string) $config['admin_email']); ?></a>
</li>
</ul>
</div>
<div class="topbar-one__social" style="width: 30%;">
<a href="https://facebook.com"><i class="fab fa-facebook-f"></i></a>
<a href="https://twitter.com"><i class="fab fa-twitter"></i></a>
<a href="https://instagram.com"><i class="fab fa-instagram"></i></a>
<a href="https://www.youtube.com/"><i class="fab fa-linkedin"></i></a>
<a href="/index/user/login" class="mr-10"><i class="layui-icon layui-icon-username"></i> 登录</a>
<a href="/index/user/register" class="mr-10"><i class="layui-icon layui-icon-user"></i> 注册</a>
<a href="javascript:;" class="qrcode-trigger"><i class="layui-icon layui-icon-qrcode"></i> 公众号</a>
<div class="qrcode-popup"
style="display:none;position:absolute;right:54px;top:32px;background:#fff;padding:10px;box-shadow:0 0 10px rgba(0,0,0,0.1); z-index: 1000;">
<img src="<?php echo htmlentities((string) $config['admin_wechat']); ?>" alt="公众号二维码" style="width:180px;height:180px;">
</div>
</div>
</div>
</div>
@ -39,7 +46,7 @@
<div class="main-menu">
<div class="container">
<div class="main-menu__logo">
<a href="index.html"><img src="/static/images/logo.png" width="186" alt="Logo"></a>
<a href="index.html"><img src="<?php echo htmlentities((string) $config['logo1']); ?>" width="186" alt="Logo"></a>
</div>
<div class="main-menu__nav">
<ul class="main-menu__list">
@ -50,8 +57,28 @@
</ul>
</div>
<div class="main-menu__right">
<a href="#" class="main-menu__search"><i class="layui-icon layui-icon-search"></i></a>
<a href="login.html" class="main-menu__login"><i class="layui-icon layui-icon-username"></i></a>
<div class="layui-inline">
<div class="layui-inline" style="position: relative;">
<img src="/static/images/avatar.webp" class="layui-circle"
style="width: 40px; height: 40px; cursor: pointer;" id="userAvatarMain">
<div class="user-dropdown" id="userDropdownMain">
<ul>
<li>
<a href="/index/user/profile"><i
class="layui-icon layui-icon-user"></i><span>个人中心</span></a>
</li>
<li>
<a href="/index/user/settings"><i
class="layui-icon layui-icon-set"></i><span>账号管理</span></a>
</li>
<li>
<a href="javascript:;" class="logout-btn"><i
class="layui-icon layui-icon-logout"></i><span>退出登录</span></a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
@ -59,43 +86,6 @@
<!-- Banner轮播 -->
<div class="layui-carousel" id="test10" lay-filter="test10">
<div carousel-item="">
<div>
<div class="banner-content">
<span class="banner-title">智能科技 引领未来</span>
<span class="banner-desc">打造智能化解决方案,助力企业数字化转型,打造智能化解决方案,助力企业数字化转型,打造智能化解决方案,助力企业数字化转型</span>
<a href="#" class="btn btn-primary" style="margin-top: 20px;width:150px">了解更多</a>
</div>
<a href="#" class="banner-slide">
<img src="/static/images/banner/banner1.jpg" alt="Banner 1">
</a>
</div>
<div>
<div class="banner-content">
<span class="banner-title">创新技术 卓越服务</span>
<spanp class="banner-desc">以创新科技为核心,为客户提供优质服务</spanp>
</div>
<a href="#" class="banner-slide">
<img src="/static/images/banner/banner2.jpg" alt="Banner 2">
</a>
</div>
<div>
<div class="banner-content">
<span class="banner-title">专业团队 值得信赖</span>
<spanp class="banner-desc">资深专家团队,为您提供专业的技术支持</spanp>
</div>
<a href="#" class="banner-slide">
<img src="/static/images/banner/banner3.jpg" alt="Banner 3">
</a>
</div>
<div>
<div class="banner-content">
<span class="banner-title">全球视野 本地服务</span>
<span class="banner-desc">立足本地,放眼全球,打造国际化服务</span>
</div>
<a href="#" class="banner-slide">
<img src="/static/images/banner/banner4.jpg" alt="Banner 4">
</a>
</div>
</div>
</div>
</div>
@ -105,7 +95,7 @@
<div class="sticky-nav" style="display: none;">
<div class="container">
<div class="sticky-nav__logo">
<a href="index.html"><img src="/static/images/logo.png" width="150" alt="Logo"></a>
<a href="index.html"><img src="<?php echo htmlentities((string) $config['logo1']); ?>" width="150" alt="Logo"></a>
</div>
<div class="sticky-nav__menu">
<ul>
@ -116,65 +106,350 @@
</ul>
</div>
<div class="sticky-nav__right">
<a href="#" class="main-menu__search"><i class="layui-icon layui-icon-search"></i></a>
<a href="login.html" class="main-menu__login"><i class="layui-icon layui-icon-username"></i></a>
<div class="main-menu__right">
<div class="layui-inline">
<div class="layui-inline" style="position: relative;">
<img src="/static/images/avatar.webp" class="layui-circle"
style="width: 40px; height: 40px; cursor: pointer;" id="userAvatarSticky">
<div class="user-dropdown" id="userDropdownSticky">
<ul>
<li>
<a href="/index/user/profile"><i
class="layui-icon layui-icon-user"></i><span>个人中心</span></a>
</li>
<li>
<a href="/index/user/settings"><i
class="layui-icon layui-icon-set"></i><span>账号管理</span></a>
</li>
<li>
<a href="javascript:;" class="logout-btn"><i
class="layui-icon layui-icon-logout"></i><span>退出登录</span></a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
layui.use(['carousel', 'form'], function(){
var carousel = layui.carousel
,form = layui.form;
//图片轮播
carousel.render({
elem: '#test10'
,width: '100%'
,height: '86vh'
,interval: 4000
});
var $ = layui.$, active = {
set: function(othis){
var THIS = 'layui-bg-normal'
,key = othis.data('key')
,options = {};
othis.css('background-color', '#5FB878').siblings().removeAttr('style');
options[key] = othis.data('value');
ins3.reload(options);
<style>
/* 用户头像样式 */
#userAvatar {
width: 40px;
height: 40px;
cursor: pointer;
transition: all 0.3s ease;
}
};
//监听开关
form.on('switch(autoplay)', function(){
ins3.reload({
autoplay: this.checked
});
});
$('.demoSet').on('keyup', function(){
var value = this.value
,options = {};
if(!/^\d+$/.test(value)) return;
options[this.name] = value;
ins3.reload(options);
});
// 监听滚动事件
$(window).scroll(function() {
var scrollTop = $(window).scrollTop();
if (scrollTop > 150) { // 当滚动超过150px时显示固定导航
$('.sticky-nav').fadeIn();
} else {
$('.sticky-nav').fadeOut();
}
});
});
</script>
#userAvatar:hover {
transform: scale(1.05);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
/* 下拉菜单容器 */
.user-dropdown {
position: absolute;
top: 50px;
right: 0;
width: 160px;
background: #fff;
border-radius: 4px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
opacity: 0;
visibility: hidden;
transform: translateY(-10px);
transition: all 0.3s ease;
z-index: 9999;
}
.user-dropdown.show {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
/* 下拉菜单列表 */
.user-dropdown ul {
margin: 0;
padding: 5px 0;
list-style: none;
}
/* 下拉菜单项 */
.user-dropdown li {
margin: 0;
padding: 0;
}
/* 下拉菜单链接 */
.user-dropdown li a {
display: flex;
align-items: center;
padding: 10px 15px;
color: #333;
text-decoration: none;
transition: all 0.3s ease;
}
/* 下拉菜单图标 */
.user-dropdown li a i {
margin-right: 10px;
font-size: 16px;
color: #666;
}
/* 下拉菜单文字 */
.user-dropdown li a span {
font-size: 14px;
}
/* 下拉菜单悬停效果 */
.user-dropdown li a:hover {
background: #f5f5f5;
color: #1E9FFF;
}
.user-dropdown li a:hover i {
color: #1E9FFF;
}
/* 分隔线 */
.user-dropdown li:not(:last-child) {
border-bottom: 1px solid #f0f0f0;
}
#userDropdownSticky a {
color: #0d6efd !important;
}
/* Banner样式 */
.banner-content {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.banner-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.banner-image img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.banner-text {
position: absolute;
top: 40%;
left: 10%;
z-index: 1;
display: flex;
flex-direction: column;
align-items: flex-start;
color: #fff;
}
.banner-text a {
text-decoration: none;
margin-top: 30px;
}
.banner-title {
font-size: 4em;
font-weight: 600;
margin-bottom: 10px;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}
.banner-desc {
font-size: 2em;
font-weight: 400;
max-width: 800px;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}
.banner-btn {
background: #fff;
color: #000;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
transition: all 0.3s ease;
}
.banner-btn:hover {
background: #000;
color: #fff;
}
.banner-slider {
width: 100%;
height: 86vh;
overflow: hidden;
position: relative;
}
.banner-container {
width: 100%;
height: 100%;
}
.banner-slide {
display: block;
width: 100%;
height: 100%;
}
.banner-slide img {
width: 100%;
height: 100%;
object-fit: cover;
/* 关键:等比缩放并铺满 */
display: block;
}
.layui-carousel {
background: #f8f8f8;
margin: 0;
padding: 0;
}
/* 确保轮播容器和项目的高度正确 */
#test10,
#test10 [carousel-item],
#test10 [carousel-item]>* {
height: 86vh !important;
}
#test10 [carousel-item]>* {
background: none !important;
}
</style>
<script>
layui.use(['carousel', 'form', 'layer'], function () {
var carousel = layui.carousel, form = layui.form, layer = layui.layer, $ = layui.$;
// 加载banner数据
$.ajax({
url: '/index/index/bannerlist',
type: 'GET',
success: function (res) {
if (res.code === 1) {
var bannerHtml = '';
res.banner.forEach(function (banner) {
bannerHtml += '<div>' +
'<div class="banner-content">' +
'<div class="banner-image">' +
'<img src="' + banner.image + '" alt="' + (banner.title || '') + '">' +
'</div>' +
'<div class="banner-text">' +
'<span class="banner-title">' + (banner.title || '') + '</span>' +
'<span class="banner-desc">' + (banner.desc || '') + '</span>' +
'<a href="' + (banner.url || 'javascript:;') + '" class="banner-slide">' +
'<span class="banner-btn">查看详情</span>' +
'</a>' +
'</div>' +
'</div>' +
'</div>';
});
$('#test10 div[carousel-item]').html(bannerHtml);
// 图片轮播
carousel.render({
elem: '#test10',
width: '100%',
height: '100vh',
interval: 4000,
anim: 'fade',
autoplay: true,
full: false,
arrow: 'hover'
});
}
}
});
$(document).ready(function () {
// 主导航头像
$("#userAvatarMain").click(function (e) {
e.stopPropagation();
$("#userDropdownMain").toggleClass("show");
$("#userDropdownSticky").removeClass("show"); // 保证只显示一个
});
// 固定导航头像
$("#userAvatarSticky").click(function (e) {
e.stopPropagation();
$("#userDropdownSticky").toggleClass("show");
$("#userDropdownMain").removeClass("show"); // 保证只显示一个
});
// 点击页面其他地方隐藏所有菜单
$(document).click(function (e) {
if (!$(e.target).closest('.user-dropdown, #userAvatarMain, #userAvatarSticky').length) {
$("#userDropdownMain, #userDropdownSticky").removeClass("show");
}
});
// 点击菜单项时隐藏菜单
$("#userDropdownMain li a, #userDropdownSticky li a").click(function () {
$("#userDropdownMain, #userDropdownSticky").removeClass("show");
});
});
// 退出登录
$('.logout-btn').on('click', function () {
layer.confirm('确定要退出登录吗?', {
btn: ['确定', '取消']
}, function () {
window.location.href = '/index/user/logout';
});
});
// 监听滚动事件
$(window).scroll(function () {
var scrollTop = $(window).scrollTop();
if (scrollTop > 150) { // 当滚动超过150px时显示固定导航
$('.sticky-nav').fadeIn();
} else {
$('.sticky-nav').fadeOut();
}
});
// 公众号二维码
const trigger = document.querySelector('.qrcode-trigger');
const popup = document.querySelector('.qrcode-popup');
// 鼠标移入显示二维码
trigger.addEventListener('mouseenter', function () {
popup.style.display = 'block';
});
// 鼠标移出隐藏二维码
trigger.addEventListener('mouseleave', function () {
popup.style.display = 'none';
});
// 鼠标移入二维码区域时保持显示
popup.addEventListener('mouseenter', function () {
popup.style.display = 'block';
});
// 鼠标移出二维码区域时隐藏
popup.addEventListener('mouseleave', function () {
popup.style.display = 'none';
});
});
</script>
<main class="main-content">
<div class="container">
<!-- 站点资讯模块 -->
@ -203,7 +478,7 @@ layui.use(['carousel', 'form'], function(){
<div class="module-header">
<div>
<div class="ModuleTitle_titleWrapper">
<h3 class="ModuleTitle_title">技术文章11</h3>
<h3 class="ModuleTitle_title">技术文章</h3>
<div class="tab-container">
<div class="tab-header">
<div class="tab-item active" data-tab="all">全部</div>
@ -219,6 +494,48 @@ layui.use(['carousel', 'form'], function(){
</div>
</div>
<!-- 资源下载模块 -->
<div class="core-block core-module" id="resourcesDownload" style="order: 3;">
<div class="module-header">
<div>
<div class="ModuleTitle_titleWrapper">
<h3 class="ModuleTitle_title">办公资源</h3>
<div class="tab-container">
<div class="tab-header">
<div class="tab-item active" data-tab="all">全部</div>
<!-- 分类标签将通过JavaScript动态加载 -->
</div>
</div>
</div>
</div>
<div class="more-btn">更多</div>
</div>
<div class="product-list" id="resourcesDownloadList">
<!-- 文章将通过JavaScript动态加载 -->
</div>
</div>
<!-- 程序下载模块 -->
<div class="core-block core-module" id="programDownload" style="order: 3;">
<div class="module-header">
<div>
<div class="ModuleTitle_titleWrapper">
<h3 class="ModuleTitle_title">程序下载</h3>
<div class="tab-container">
<div class="tab-header">
<div class="tab-item active" data-tab="all">全部</div>
<!-- 分类标签将通过JavaScript动态加载 -->
</div>
</div>
</div>
</div>
<div class="more-btn">更多</div>
</div>
<div class="product-list" id="programDownloadList">
<!-- 程序将通过JavaScript动态加载 -->
</div>
</div>
</div>
</main>
@ -285,6 +602,60 @@ layui.use(['carousel', 'form'], function(){
});
}
// 加载资源下载
function loadResources() {
fetch('/index/index/resourcesList')
.then(response => response.json())
.then(result => {
if (result.code === 1) {
// 渲染分类标签
if (result.categories) {
renderCategoryTabs(result.categories, 'resourcesDownload');
}
// 渲染资源列表
if (result.resources && result.resources.length > 0) {
// 只取最新的8条
renderResources(result.resources.slice(0, 8), 'resourcesDownloadList');
} else {
showNoData('resourcesDownloadList');
}
} else {
showNoData('resourcesDownloadList');
}
})
.catch(error => {
console.error('请求失败:', error);
showError('resourcesDownloadList');
});
}
// 加载程序下载
function loadPrograms() {
fetch('/index/index/programList')
.then(response => response.json())
.then(result => {
if (result.code === 1) {
// 渲染分类标签
if (result.categories) {
renderCategoryTabs(result.categories, 'programDownload');
}
// 渲染程序列表
if (result.programs && result.programs.length > 0) {
// 只取最新的8条
renderPrograms(result.programs.slice(0, 8), 'programDownloadList');
} else {
showNoData('programDownloadList');
}
} else {
showNoData('programDownloadList');
}
})
.catch(error => {
console.error('请求失败:', error);
showError('programDownloadList');
});
}
// 显示无数据提示
function showNoData(containerId) {
document.getElementById(containerId).innerHTML = '<div class="no-data">暂无数据</div>';
@ -333,11 +704,20 @@ layui.use(['carousel', 'form'], function(){
// 获取选中的分类ID
const selectedCategoryId = this.getAttribute('data-tab');
// 重新加载对应分类的文章
if (moduleId === 'opencourse') {
loadCategoryArticles(selectedCategoryId, 'webArticlesList');
} else {
loadCategoryArticles(selectedCategoryId, 'techArticlesList');
// 根据不同模块加载对应数据
switch(moduleId) {
case 'opencourse':
loadCategoryArticles(selectedCategoryId, 'webArticlesList');
break;
case 'techArticles':
loadCategoryArticles(selectedCategoryId, 'techArticlesList');
break;
case 'resourcesDownload':
loadCategoryResources(selectedCategoryId, 'resourcesDownloadList');
break;
case 'programDownload':
loadCategoryPrograms(selectedCategoryId, 'programDownloadList');
break;
}
});
});
@ -435,10 +815,155 @@ layui.use(['carousel', 'form'], function(){
`;
}
// 渲染资源列表
function renderResources(resources, containerId) {
const container = document.getElementById(containerId);
if (!container) return;
let html = '';
if (Array.isArray(resources)) {
resources.forEach(resource => {
html += createResourceHtml(resource);
});
}
container.innerHTML = html || '<div class="no-data">暂无数据</div>';
}
// 创建资源HTML
function createResourceHtml(resource) {
if (!resource) return '';
// 格式化日期
const uploadDate = new Date(resource.uploaddate * 1000);
const formattedDate = uploadDate.toLocaleDateString('zh-CN', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
});
// 格式化文件大小
const formatFileSize = (bytes) => {
if (bytes === 0) return '0 B';
const k = 1024;
const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
const i = Math.floor(Math.log(bytes) / Math.log(k));
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
};
return `
<div class="opencourse product-item" onclick="window.open('/index/resource/detail?id=${resource.id || ''}', '_blank')">
<div class="video">
<img src="${resource.thumbnail || '/static/images/default-resource.png'}" alt="" class="cover">
<div class="file-type">${resource.filetype || '未知类型'}</div>
</div>
<div class="introduction">
<div class="title">${resource.title || '无标题'}</div>
<div class="description">${resource.description || '暂无描述'}</div>
<div class="publishdate">${formattedDate}</div>
</div>
<div class="bottom">
<div class="views"><i class="fa-solid fa-eye"></i><span style="margin-left: 5px;">${resource.views || 0}</span></div>
<div class="author"><i class="fa-regular fa-user"></i><span style="margin-left: 5px;">${resource.uploader || '未知作者'}</span></div>
</div>
</div>
`;
}
// 渲染程序列表
function renderPrograms(programs, containerId) {
const container = document.getElementById(containerId);
if (!container) return;
let html = '';
if (Array.isArray(programs)) {
programs.forEach(program => {
html += createProgramHtml(program);
});
}
container.innerHTML = html || '<div class="no-data">暂无数据</div>';
}
// 创建程序HTML
function createProgramHtml(program) {
if (!program) return '';
// 格式化日期
const createDate = new Date(program.create_time * 1000);
const formattedDate = createDate.toLocaleDateString('zh-CN', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
});
return `
<div class="opencourse product-item" onclick="window.open('/index/program/detail?id=${program.id || ''}', '_blank')">
<div class="video">
<img src="${program.icon || '/static/images/default-program.png'}" alt="" class="cover">
</div>
<div class="introduction">
<div class="title">${program.title || '无标题'}</div>
<div class="publishdate">${formattedDate}</div>
</div>
<div class="bottom">
<div class="views"><i class="fa-solid fa-eye"></i><span style="margin-left: 5px;">${program.views || 0}</span></div>
<div class="author"><i class="fa-regular fa-user"></i><span style="margin-left: 5px;">${program.uploader || '未知作者'}</span></div>
</div>
</div>
`;
}
// 加载分类资源
function loadCategoryResources(categoryId, containerId) {
fetch('/index/index/resourcesList')
.then(response => response.json())
.then(result => {
if (result.code === 1) {
if (categoryId === 'all') {
renderResources(result.resources.slice(0, 8), containerId);
} else {
const filteredResources = result.resources.filter(resource => resource.cate == categoryId);
renderResources(filteredResources, containerId);
}
} else {
showNoData(containerId);
}
})
.catch(error => {
console.error('请求失败:', error);
showError(containerId);
});
}
// 加载分类程序
function loadCategoryPrograms(categoryId, containerId) {
fetch('/index/index/programList')
.then(response => response.json())
.then(result => {
if (result.code === 1) {
if (categoryId === 'all') {
renderPrograms(result.programs.slice(0, 8), containerId);
} else {
const filteredPrograms = result.programs.filter(program => program.cate == categoryId);
renderPrograms(filteredPrograms, containerId);
}
} else {
showNoData(containerId);
}
})
.catch(error => {
console.error('请求失败:', error);
showError(containerId);
});
}
// 页面加载完成后执行
document.addEventListener('DOMContentLoaded', function() {
loadWebArticles();
loadTechArticles();
loadResources();
loadPrograms();
});
</script>
<footer class="footer" style="background-image: url(/static/images/footer-bg-1.png)">
@ -446,7 +971,7 @@ layui.use(['carousel', 'form'], function(){
<div class="row" style="width: 100%;">
<div class="row-main">
<div class="mr-20">
<img src="/static/images/logo-l-w.png" alt="" height="70">
<img src="<?php echo htmlentities((string) $config['logo']); ?>" alt="" height="70">
<p class="text-white-50 my-4 f18" style="width: 400px;">美天智能科技,这里是介绍!</p>
</div>
<div style="display: flex; justify-content: space-between;width: 100%;margin-right: 200px;">
@ -478,7 +1003,7 @@ layui.use(['carousel', 'form'], function(){
<div>
<div class="text-center">
<img src="/static/images/code.png" alt="微信二维码" class="img-fluid" style="max-width: 150px;">
<img src="<?php echo htmlentities((string) $config['admin_wechat']); ?>" alt="微信二维码" class="img-fluid" style="max-width: 150px;">
<p class="text-white-50 mt-2">微信公众号</p>
</div>
</div>