更新后端内容
This commit is contained in:
云泽网
parent
bfa37897b0
commit
9aeaf40ad3
@ -13,37 +13,90 @@ class Article extends Base
|
|||||||
// 文章列表
|
// 文章列表
|
||||||
public function articlelist()
|
public function articlelist()
|
||||||
{
|
{
|
||||||
$lists = Db::table('yz_article')
|
if (Request::isPost()) {
|
||||||
->where('delete_time', null)
|
$category = input('post.category');
|
||||||
->where('status', '<>', 3)
|
$page = input('post.page', 1);
|
||||||
->order('id DESC')
|
$limit = input('post.limit', 20);
|
||||||
->select()
|
|
||||||
->each(function ($item) {
|
$query = Db::table('yz_article')
|
||||||
// 获取分类信息
|
->where('delete_time', null)
|
||||||
|
->where('status', '<>', 3);
|
||||||
|
|
||||||
|
if (!empty($category)) {
|
||||||
|
// 先获取分类ID
|
||||||
$cateInfo = Db::table('yz_article_category')
|
$cateInfo = Db::table('yz_article_category')
|
||||||
->where('id', $item['cate'])
|
->where('name', $category)
|
||||||
->field('name, image')
|
->where('delete_time', null)
|
||||||
|
->where('status', 1)
|
||||||
->find();
|
->find();
|
||||||
|
|
||||||
// 设置分类名称
|
if ($cateInfo) {
|
||||||
$item['cate'] = $cateInfo['name'];
|
$query = $query->where('cate', $cateInfo['id']);
|
||||||
|
|
||||||
// 如果文章没有图片，使用分类的图片
|
|
||||||
if (empty($item['image']) && !empty($cateInfo['image'])) {
|
|
||||||
$item['image'] = $cateInfo['image'];
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取总记录数
|
||||||
|
$count = $query->count();
|
||||||
|
|
||||||
|
// 获取分页数据
|
||||||
|
$lists = $query->order('id DESC')
|
||||||
|
->page($page, $limit)
|
||||||
|
->select()
|
||||||
|
->each(function ($item) {
|
||||||
|
// 获取分类信息
|
||||||
|
$cateInfo = Db::table('yz_article_category')
|
||||||
|
->where('id', $item['cate'])
|
||||||
|
->field('name, image')
|
||||||
|
->find();
|
||||||
|
|
||||||
// 格式化时间
|
// 设置分类名称
|
||||||
$item['create_time'] = date('Y-m-d H:i:s', $item['create_time']);
|
$item['cate'] = $cateInfo['name'];
|
||||||
$item['publishdate'] = $item['publishdate'] ? date('Y-m-d H:i:s', $item['publishdate']) : '';
|
|
||||||
|
|
||||||
return $item;
|
// 如果文章没有图片，使用分类的图片
|
||||||
});
|
if (empty($item['image']) && !empty($cateInfo['image'])) {
|
||||||
|
$item['image'] = $cateInfo['image'];
|
||||||
|
}
|
||||||
|
|
||||||
View::assign([
|
// 格式化时间
|
||||||
'lists' => $lists
|
$item['create_time'] = date('Y-m-d H:i:s', $item['create_time']);
|
||||||
]);
|
$item['publishdate'] = $item['publishdate'] ? date('Y-m-d H:i:s', $item['publishdate']) : '';
|
||||||
return View::fetch();
|
|
||||||
|
return $item;
|
||||||
|
});
|
||||||
|
|
||||||
|
return json([
|
||||||
|
'code' => 0,
|
||||||
|
'msg' => '获取成功',
|
||||||
|
'count' => $count,
|
||||||
|
'data' => $lists
|
||||||
|
]);
|
||||||
|
} else {
|
||||||
|
// 获取所有分类并构建父子结构
|
||||||
|
$allCategories = Db::table('yz_article_category')
|
||||||
|
->where('delete_time', null)
|
||||||
|
->where('status', 1)
|
||||||
|
->order('sort asc, id asc')
|
||||||
|
->select()
|
||||||
|
->toArray();
|
||||||
|
|
||||||
|
$categories = [];
|
||||||
|
foreach ($allCategories as $category) {
|
||||||
|
if ($category['cid'] == 0) {
|
||||||
|
$category['children'] = [];
|
||||||
|
foreach ($allCategories as $subCategory) {
|
||||||
|
if ($subCategory['cid'] == $category['id']) {
|
||||||
|
$category['children'][] = $subCategory;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$categories[] = $category;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
View::assign([
|
||||||
|
'categories' => $categories
|
||||||
|
]);
|
||||||
|
return View::fetch();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 添加文章
|
// 添加文章
|
||||||
@ -149,41 +202,43 @@ class Article extends Base
|
|||||||
public function articlecate()
|
public function articlecate()
|
||||||
{
|
{
|
||||||
if (Request::isPost()) {
|
if (Request::isPost()) {
|
||||||
$count = Db::table('yz_article_category')
|
|
||||||
->where('delete_time', null)
|
|
||||||
->where('status', 1)
|
|
||||||
->count();
|
|
||||||
$page = (int) input('post.page', 1);
|
|
||||||
$limit = (int) input('post.limit', 10);
|
|
||||||
$lists = Db::table('yz_article_category')
|
$lists = Db::table('yz_article_category')
|
||||||
->where('delete_time', null)
|
->where('delete_time', null)
|
||||||
->where('status', 1)
|
->where('status', 1)
|
||||||
->order('id asc')
|
->order('sort asc, id asc')
|
||||||
->page($page, $limit)
|
|
||||||
->select()
|
->select()
|
||||||
->each(function ($item) {
|
->toArray();
|
||||||
$item['create_time'] = date('Y-m-d H:i:s', $item['create_time']);
|
|
||||||
return $item;
|
|
||||||
});
|
|
||||||
return json(['code' => 0, 'msg' => '获取成功', 'data' => $lists]);
|
|
||||||
} else {
|
|
||||||
// 获取分类列表
|
|
||||||
$lists = Db::table('yz_article_category')
|
|
||||||
->where('delete_time', null)
|
|
||||||
->where('status', 1)
|
|
||||||
->order('id asc')
|
|
||||||
->select()
|
|
||||||
->each(function ($item) {
|
|
||||||
$item['create_time'] = date('Y-m-d H:i:s', $item['create_time']);
|
|
||||||
return $item;
|
|
||||||
});
|
|
||||||
|
|
||||||
View::assign([
|
// 构建树形结构
|
||||||
'lists' => $lists
|
$tree = [];
|
||||||
]);
|
foreach ($lists as $item) {
|
||||||
return View::fetch();
|
if ($item['cid'] == 0) {
|
||||||
// return json(['code' => 0, 'msg' => '获取成功', 'data' => $lists]);
|
$node = [
|
||||||
|
'id' => $item['id'],
|
||||||
|
'title' => $item['name'],
|
||||||
|
'children' => []
|
||||||
|
];
|
||||||
|
|
||||||
|
// 查找子分类
|
||||||
|
foreach ($lists as $subItem) {
|
||||||
|
if ($subItem['cid'] == $item['id']) {
|
||||||
|
$node['children'][] = [
|
||||||
|
'id' => $subItem['id'],
|
||||||
|
'title' => $subItem['name'],
|
||||||
|
'children' => []
|
||||||
|
];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$tree[] = $node;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return json(['code' => 0, 'msg' => '获取成功', 'data' => $tree]);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 非 POST 请求返回视图
|
||||||
|
return View::fetch();
|
||||||
}
|
}
|
||||||
|
|
||||||
//获取分类结构
|
//获取分类结构
|
||||||
@ -224,15 +279,13 @@ class Article extends Base
|
|||||||
public function cateadd()
|
public function cateadd()
|
||||||
{
|
{
|
||||||
if (Request::isPost()) {
|
if (Request::isPost()) {
|
||||||
// 将时间戳转换为 'Y-m-d H:i:s' 格式
|
|
||||||
$currentDateTime = time();
|
|
||||||
$data = [
|
$data = [
|
||||||
'name' => input('post.name'),
|
'name' => input('post.name'),
|
||||||
'image' => input('post.image'),
|
'image' => input('post.image'),
|
||||||
'cid' => input('post.cid'),
|
'cid' => input('post.cid'),
|
||||||
'sort' => input('post.sort', 0),
|
'sort' => input('post.sort', 0),
|
||||||
'status' => input('post.status', 1),
|
'status' => input('post.status', 1),
|
||||||
'create_time' => $currentDateTime
|
'create_time' => time()
|
||||||
];
|
];
|
||||||
|
|
||||||
$insert = Db::table('yz_article_category')->insert($data);
|
$insert = Db::table('yz_article_category')->insert($data);
|
||||||
@ -241,17 +294,22 @@ class Article extends Base
|
|||||||
}
|
}
|
||||||
return json(['code' => 0, 'msg' => '添加成功', 'data' => []]);
|
return json(['code' => 0, 'msg' => '添加成功', 'data' => []]);
|
||||||
} else {
|
} else {
|
||||||
$lists = Db::table('yz_article_category')
|
// 获取所有可选的父级分类
|
||||||
->order('id DESC')
|
$parentCategories = Db::table('yz_article_category')
|
||||||
|
->where('delete_time', null)
|
||||||
|
->where('status', 1)
|
||||||
|
->where('cid', 0)
|
||||||
|
->field('id, name')
|
||||||
->select()
|
->select()
|
||||||
->each(function ($item, $key) {
|
->toArray();
|
||||||
$item['create_time'] = time();
|
|
||||||
return $item;
|
return json([
|
||||||
});
|
'code' => 0,
|
||||||
View::assign([
|
'msg' => '获取成功',
|
||||||
'lists' => $lists
|
'data' => [
|
||||||
|
'parentOptions' => $parentCategories
|
||||||
|
]
|
||||||
]);
|
]);
|
||||||
return View::fetch();
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -280,10 +338,39 @@ class Article extends Base
|
|||||||
} else {
|
} else {
|
||||||
$id = input('get.id');
|
$id = input('get.id');
|
||||||
$info = Db::table('yz_article_category')->where('id', $id)->find();
|
$info = Db::table('yz_article_category')->where('id', $id)->find();
|
||||||
View::assign([
|
|
||||||
'info' => $info
|
// 获取所有可选的父级分类
|
||||||
|
$parentCategories = Db::table('yz_article_category')
|
||||||
|
->where('delete_time', null)
|
||||||
|
->where('status', 1)
|
||||||
|
->where('id', '<>', $id) // 排除自己
|
||||||
|
->where(function ($query) use ($id) {
|
||||||
|
// 排除自己的所有子分类
|
||||||
|
$query->where('cid', '<>', $id);
|
||||||
|
})
|
||||||
|
->field('id, name, cid')
|
||||||
|
->select()
|
||||||
|
->toArray();
|
||||||
|
|
||||||
|
// 构建父级分类选项
|
||||||
|
$parentOptions = [];
|
||||||
|
foreach ($parentCategories as $category) {
|
||||||
|
if ($category['cid'] == 0) {
|
||||||
|
$parentOptions[] = [
|
||||||
|
'id' => $category['id'],
|
||||||
|
'name' => $category['name']
|
||||||
|
];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return json([
|
||||||
|
'code' => 0,
|
||||||
|
'msg' => '获取成功',
|
||||||
|
'data' => [
|
||||||
|
'info' => $info,
|
||||||
|
'parentOptions' => $parentOptions
|
||||||
|
]
|
||||||
]);
|
]);
|
||||||
return View::fetch();
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -1,8 +1,8 @@
|
|||||||
{include file="public/header" /}
|
{include file="public/header" /}
|
||||||
<div class="config-container">
|
<div class="config-container">
|
||||||
<div class="config-header" style="display:flex;justify-content: space-between;">
|
<div class="config-header" style="display:flex;justify-content: space-between;">
|
||||||
<div>
|
<div style="display: flex; align-items: center;">
|
||||||
<span>文章分类列表</span>
|
<span>文章分类</span>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="add()">
|
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="add()">
|
||||||
@ -14,127 +14,390 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<table class="layui-table">
|
<div class="layui-row" style="margin-top: 15px;">
|
||||||
<thead>
|
<div class="layui-col-md6">
|
||||||
<tr>
|
<div class="layui-card">
|
||||||
<th width="20">ID</th>
|
<div class="layui-card-header">分类列表</div>
|
||||||
<th width="120">分类名称</th>
|
<div class="layui-card-body">
|
||||||
<th width="120">分类图片</th>
|
<div id="categoryList"></div>
|
||||||
<th>描述</th>
|
</div>
|
||||||
<th width="80">排序</th>
|
</div>
|
||||||
<th width="80">状态</th>
|
</div>
|
||||||
<th width="180">创建时间</th>
|
<div class="layui-col-md4"">
|
||||||
<th width="240">操作</th>
|
<div class="layui-card">
|
||||||
</tr>
|
<div class="layui-card-header">分类信息</div>
|
||||||
</thead>
|
<div class="layui-card-body">
|
||||||
<tbody>
|
<div id="defaultTip" style="text-align: center; padding: 50px 0; color: #999;">
|
||||||
{volist name="lists" id='vo'}
|
<i class="layui-icon layui-icon-face-surprised" style="font-size: 30px;"></i>
|
||||||
{if condition="$vo.cid eq 0"}
|
<p style="margin-top: 10px;">请选择左侧分类</p>
|
||||||
<tr>
|
</div>
|
||||||
<td>{$vo.id}</td>
|
<form class="layui-form" lay-filter="categoryForm" style="display: none;">
|
||||||
<td>{$vo.name}</td>
|
<input type="hidden" name="id" id="categoryId">
|
||||||
<td><img src="{$vo.image}" style="width: 100px;height: auto;"></td>
|
<div class="layui-form-item">
|
||||||
<td></td>{$vo.desc}</td>
|
<label class="layui-form-label">分类名称</label>
|
||||||
<td>{$vo.sort}</td>
|
<div class="layui-input-block">
|
||||||
<td>{$vo.status==1?'开启':'<span style="color:red;">禁用</span>'}</td>
|
<input type="text" name="name" required lay-verify="required" placeholder="请输入分类名称"
|
||||||
<td>{$vo.create_time}</td>
|
autocomplete="off" class="layui-input">
|
||||||
<td>
|
</div>
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs"
|
</div>
|
||||||
onclick="addchanel({$vo.id})">
|
<div class="layui-form-item">
|
||||||
<i class="layui-icon layui-icon-add-1"></i>添加子栏目
|
<label class="layui-form-label">父级分类</label>
|
||||||
</button>
|
<div class="layui-input-block">
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="edit({$vo.id})">
|
<select name="cid" lay-verify="required">
|
||||||
<i class="layui-icon layui-icon-edit"></i>编辑
|
<option value="0">顶级分类</option>
|
||||||
</button>
|
</select>
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="del({$vo.id})">
|
</div>
|
||||||
<i class="layui-icon layui-icon-delete"></i>删除
|
</div>
|
||||||
</button>
|
<div class="layui-form-item">
|
||||||
</td>
|
<label class="layui-form-label">封面图片</label>
|
||||||
</tr>
|
<div class="layui-input-block">
|
||||||
{volist name="lists" id='sub'}
|
<input type="text" name="image" placeholder="请输入图片地址" autocomplete="off"
|
||||||
{if condition="$sub.cid eq $vo.id"}
|
class="layui-input" id="imageInput">
|
||||||
<tr>
|
<div class="layui-upload" style="margin-top: 20px;">
|
||||||
<td>{$sub.id}</td>
|
<div>
|
||||||
<td style="padding-left: 30px;">├─ {$sub.name}</td>
|
<button type="button" class="layui-btn" id="uploadImage">上传图片</button>
|
||||||
<td><img src="{$sub.image}" style="width: 100px;height: auto;"></td>
|
<span style="color: #999; margin-left: 10px;">建议尺寸：250px*140px</span>
|
||||||
<td>{$sub.desc}</td>
|
</div>
|
||||||
<td>{$sub.sort}</td>
|
<div class="layui-upload-list">
|
||||||
<td>{$sub.status==1?'开启':'<span style="color:red;">禁用</span>'}</td>
|
<img class="layui-upload-img" id="imagePreview" style="margin-top: 10px;">
|
||||||
<td>{$sub.create_time}</td>
|
<i class="layui-icon layui-icon-close delete-image"
|
||||||
<td>
|
style="display: none; position: absolute; top: 0; right: 0; cursor: pointer; color: #FF5722;"></i>
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="edit({$sub.id})">
|
</div>
|
||||||
<i class="layui-icon layui-icon-edit"></i>编辑
|
</div>
|
||||||
</button>
|
</div>
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="del({$sub.id})">
|
</div>
|
||||||
<i class="layui-icon layui-icon-delete"></i>删除
|
<div class="layui-form-item">
|
||||||
</button>
|
<label class="layui-form-label">排序</label>
|
||||||
</td>
|
<div class="layui-input-block">
|
||||||
</tr>
|
<input type="number" name="sort" value="0" class="layui-input">
|
||||||
{/if}
|
</div>
|
||||||
{/volist}
|
</div>
|
||||||
{/if}
|
<div class="layui-form-item">
|
||||||
{/volist}
|
<label class="layui-form-label">状态</label>
|
||||||
</tbody>
|
<div class="layui-input-block">
|
||||||
</table>
|
<input type="radio" name="status" value="1" title="正常" checked>
|
||||||
|
<input type="radio" name="status" value="0" title="禁用">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<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>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
layui.use(['layer'], function () {
|
layui.use(['layer', 'form', 'util', 'upload'], function () {
|
||||||
layer = layui.layer;
|
var layer = layui.layer;
|
||||||
$ = layui.jquery;
|
var $ = layui.jquery;
|
||||||
});
|
var form = layui.form;
|
||||||
|
var util = layui.util;
|
||||||
|
var upload = layui.upload;
|
||||||
|
|
||||||
function add() {
|
// 初始化分类列表
|
||||||
layer.open({
|
function initCategoryList() {
|
||||||
type: 2,
|
$.ajax({
|
||||||
title: '添加分类',
|
url: '/admin/article/articlecate',
|
||||||
shadeClose: true,
|
type: 'POST',
|
||||||
shade: 0.8,
|
success: function (res) {
|
||||||
area: ['800px', '600px'],
|
if (res.code === 0) {
|
||||||
content: '{:url("article/cateadd")}'
|
var html = '';
|
||||||
});
|
res.data.forEach(function (item) {
|
||||||
}
|
html += renderCategory(item);
|
||||||
|
});
|
||||||
|
$('#categoryList').html(html);
|
||||||
|
bindEvents();
|
||||||
|
} else {
|
||||||
|
layer.msg('获取分类数据失败', { icon: 2 });
|
||||||
|
}
|
||||||
|
},
|
||||||
|
error: function () {
|
||||||
|
layer.msg('请求失败，请重试', { icon: 2 });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function edit(id) {
|
// 渲染分类
|
||||||
layer.open({
|
function renderCategory(category, level = 0) {
|
||||||
type: 2,
|
var html = '<div class="category-item" data-id="' + category.id + '">';
|
||||||
title: '编辑分类',
|
html += '<div class="category-header">';
|
||||||
shadeClose: true,
|
html += '<span class="category-name">' + category.title + '</span>';
|
||||||
shade: 0.8,
|
html += '<div class="category-actions">';
|
||||||
area: ['800px', '800px'],
|
// 只有一级分类才显示添加按钮
|
||||||
content: '{:url("article/cateedit")}?id=' + id
|
if (level === 0) {
|
||||||
});
|
html += '<i class="layui-icon layui-icon-add-1 add-child" title="添加子分类"></i>';
|
||||||
}
|
}
|
||||||
|
html += '</div>';
|
||||||
|
html += '</div>';
|
||||||
|
|
||||||
function del(id) {
|
if (category.children && category.children.length > 0) {
|
||||||
layer.confirm('确定要删除该分类吗？', {
|
html += '<div class="category-children">';
|
||||||
btn: ['确定', '取消']
|
category.children.forEach(function (child) {
|
||||||
}, function () {
|
html += renderCategory(child, level + 1);
|
||||||
$.post('{:url("article/catedel")}', { id: id }, function (res) {
|
});
|
||||||
if (res.code == 0) {
|
html += '</div>';
|
||||||
|
}
|
||||||
|
|
||||||
|
html += '</div>';
|
||||||
|
return html;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 绑定事件
|
||||||
|
function bindEvents() {
|
||||||
|
// 点击分类
|
||||||
|
$('.category-name').off('click').on('click', function () {
|
||||||
|
var id = $(this).closest('.category-item').data('id');
|
||||||
|
loadCategoryInfo(id);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 点击添加子分类
|
||||||
|
$('.add-child').off('click').on('click', function (e) {
|
||||||
|
e.stopPropagation();
|
||||||
|
var id = $(this).closest('.category-item').data('id');
|
||||||
|
$('#categoryId').val('');
|
||||||
|
$('select[name="cid"]').val(id);
|
||||||
|
$('#deleteBtn').hide();
|
||||||
|
form.render();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 加载分类信息
|
||||||
|
function loadCategoryInfo(id) {
|
||||||
|
$('#defaultTip').hide();
|
||||||
|
$('form.layui-form').show();
|
||||||
|
|
||||||
|
$.get('/admin/article/cateedit?id=' + id, function (res) {
|
||||||
|
if (res.code === 0) {
|
||||||
|
// 更新父级分类选项
|
||||||
|
var $select = $('select[name="cid"]');
|
||||||
|
$select.empty();
|
||||||
|
$select.append('<option value="0">顶级分类</option>');
|
||||||
|
res.data.parentOptions.forEach(function (item) {
|
||||||
|
$select.append('<option value="' + item.id + '">' + item.name + '</option>');
|
||||||
|
});
|
||||||
|
|
||||||
|
// 填充表单数据
|
||||||
|
form.val('categoryForm', res.data.info);
|
||||||
|
|
||||||
|
// 显示图片预览
|
||||||
|
if (res.data.info.image) {
|
||||||
|
$('#imagePreview').attr('src', res.data.info.image);
|
||||||
|
$('.delete-image').show();
|
||||||
|
} else {
|
||||||
|
$('#imagePreview').attr('src', '');
|
||||||
|
$('.delete-image').hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
// 显示删除按钮
|
||||||
|
$('#deleteBtn').show();
|
||||||
|
|
||||||
|
// 重新渲染表单
|
||||||
|
form.render();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 初始化
|
||||||
|
initCategoryList();
|
||||||
|
|
||||||
|
// 默认显示提示信息
|
||||||
|
$('#defaultTip').show();
|
||||||
|
$('form.layui-form').hide();
|
||||||
|
|
||||||
|
// 监听表单提交
|
||||||
|
form.on('submit(saveCategory)', function (data) {
|
||||||
|
var url = data.field.id ? '/admin/article/cateedit' : '/admin/article/cateadd';
|
||||||
|
$.post(url, data.field, function (res) {
|
||||||
|
if (res.code === 0) {
|
||||||
layer.msg(res.msg, { icon: 1 });
|
layer.msg(res.msg, { icon: 1 });
|
||||||
setTimeout(function () {
|
initCategoryList();
|
||||||
window.location.reload();
|
|
||||||
}, 1000);
|
|
||||||
} else {
|
} else {
|
||||||
layer.msg(res.msg, { icon: 2 });
|
layer.msg(res.msg, { icon: 2 });
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
return false;
|
||||||
});
|
});
|
||||||
}
|
|
||||||
|
|
||||||
function addchanel(id) {
|
// 监听删除按钮点击
|
||||||
layer.open({
|
$('#deleteBtn').on('click', function () {
|
||||||
type: 2,
|
var id = $('input[name="id"]').val();
|
||||||
title: '添加子栏目',
|
if (!id) return;
|
||||||
shadeClose: true,
|
|
||||||
shade: 0.8,
|
layer.confirm('确定要删除该分类吗？', {
|
||||||
area: ['800px', '600px'],
|
btn: ['确定', '取消']
|
||||||
content: '{:url("article/cateadd")}?cid=' + id
|
}, function () {
|
||||||
|
$.post('/admin/article/catedel', { id: id }, function (res) {
|
||||||
|
if (res.code == 0) {
|
||||||
|
layer.msg(res.msg, { icon: 1 });
|
||||||
|
initCategoryList();
|
||||||
|
// 重置表单
|
||||||
|
form.val('categoryForm', {
|
||||||
|
id: '',
|
||||||
|
name: '',
|
||||||
|
cid: '0',
|
||||||
|
image: '',
|
||||||
|
sort: 0,
|
||||||
|
status: 1
|
||||||
|
});
|
||||||
|
$('#imagePreview').attr('src', '');
|
||||||
|
$('#deleteBtn').hide();
|
||||||
|
form.render();
|
||||||
|
} else {
|
||||||
|
layer.msg(res.msg, { icon: 2 });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// 图片上传
|
||||||
|
upload.render({
|
||||||
|
elem: '#uploadImage',
|
||||||
|
url: '/admin/upload/image', // 替换为实际的上传接口
|
||||||
|
accept: 'images',
|
||||||
|
acceptMime: 'image/*',
|
||||||
|
done: function (res) {
|
||||||
|
if (res.code === 0) {
|
||||||
|
$('#imageInput').val(res.data.url);
|
||||||
|
$('#imagePreview').attr('src', res.data.url);
|
||||||
|
layer.msg('上传成功');
|
||||||
|
} else {
|
||||||
|
layer.msg('上传失败');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// 监听图片输入框变化
|
||||||
|
$('#imageInput').on('input', function () {
|
||||||
|
var url = $(this).val();
|
||||||
|
if (url) {
|
||||||
|
$('#imagePreview').attr('src', url);
|
||||||
|
$('.delete-image').show();
|
||||||
|
} else {
|
||||||
|
$('#imagePreview').attr('src', '');
|
||||||
|
$('.delete-image').hide();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// 监听图片删除按钮点击
|
||||||
|
$(document).on('click', '.delete-image', function () {
|
||||||
|
$('#imageInput').val('');
|
||||||
|
$('#imagePreview').attr('src', '');
|
||||||
|
$(this).hide();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
function add() {
|
||||||
|
$('#defaultTip').hide();
|
||||||
|
$('form.layui-form').show();
|
||||||
|
|
||||||
|
// 重置表单
|
||||||
|
layui.form.val('categoryForm', {
|
||||||
|
id: '',
|
||||||
|
name: '',
|
||||||
|
cid: '0',
|
||||||
|
image: '',
|
||||||
|
sort: 0,
|
||||||
|
status: 1
|
||||||
|
});
|
||||||
|
$('#imagePreview').attr('src', '');
|
||||||
|
$('.delete-image').hide();
|
||||||
|
$('#deleteBtn').hide();
|
||||||
|
layui.form.render();
|
||||||
}
|
}
|
||||||
|
|
||||||
function refresh() {
|
function refresh() {
|
||||||
window.location.reload();
|
initCategoryList();
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.category-item {
|
||||||
|
margin: 5px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 8px 10px;
|
||||||
|
background-color: #f8f8f8;
|
||||||
|
border-radius: 2px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-header:hover {
|
||||||
|
background-color: #f2f2f2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-name {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-actions {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-header:hover .category-actions {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-children {
|
||||||
|
margin-left: 20px;
|
||||||
|
padding-left: 10px;
|
||||||
|
border-left: 1px solid #e6e6e6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-child {
|
||||||
|
color: #1E9FFF;
|
||||||
|
font-size: 14px;
|
||||||
|
cursor: pointer;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-child:hover {
|
||||||
|
color: #0C7CD5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.layui-upload-list {
|
||||||
|
margin-top: 10px;
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.delete-image {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
cursor: pointer;
|
||||||
|
color: #FF5722;
|
||||||
|
font-size: 20px;
|
||||||
|
background: rgba(255, 255, 255, 0.8);
|
||||||
|
border-radius: 50%;
|
||||||
|
padding: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.delete-image:hover {
|
||||||
|
color: #FF0000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.layui-card {
|
||||||
|
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
|
||||||
|
}
|
||||||
|
|
||||||
|
.layui-col-md4{
|
||||||
|
width: 40%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.layui-col-md6{
|
||||||
|
width: 60%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,8 +1,25 @@
|
|||||||
{include file="public/header" /}
|
{include file="public/header" /}
|
||||||
<div class="config-container">
|
<div class="config-container">
|
||||||
<div class="config-header" style="display:flex;justify-content: space-between;">
|
<div class="config-header" style="display:flex;justify-content: space-between;">
|
||||||
<div>
|
<div style="display: flex; align-items: center;">
|
||||||
<span>文章列表</span>
|
<span>文章列表</span>
|
||||||
|
<div class="shaixuan">
|
||||||
|
<label>筛选：</label>
|
||||||
|
<div class="layui-form">
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<select id="categoryFilter" lay-filter="categoryFilter" lay-verify="">
|
||||||
|
<option value="">全部分类</option>
|
||||||
|
{volist name="categories" id="category"}
|
||||||
|
<optgroup label="{$category.name}">
|
||||||
|
{volist name="category.children" id="subCategory"}
|
||||||
|
<option value="{$subCategory.id}">{$subCategory.name}</option>
|
||||||
|
{/volist}
|
||||||
|
</optgroup>
|
||||||
|
{/volist}
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="add()">
|
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="add()">
|
||||||
@ -14,77 +31,119 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<table class="layui-table">
|
<table id="articleTable" lay-filter="articleTable"></table>
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th width="20">ID</th>
|
|
||||||
<th>标题</th>
|
|
||||||
<th>分类</th>
|
|
||||||
<th>封面</th>
|
|
||||||
<th>作者</th>
|
|
||||||
<th>状态</th>
|
|
||||||
<th>发布时间</th>
|
|
||||||
<th>操作</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
{volist name="lists" id='vo'}
|
|
||||||
<tr>
|
|
||||||
<td>{$vo.id}</td>
|
|
||||||
<td>{$vo.title}</td>
|
|
||||||
<td>{$vo.cate}</td>
|
|
||||||
<td>
|
|
||||||
{if condition="$vo.image"}
|
|
||||||
<img src="{$vo.image}" style="max-width: 50px; max-height: 50px;">
|
|
||||||
{/if}
|
|
||||||
</td>
|
|
||||||
<td>{$vo.author}</td>
|
|
||||||
<td>
|
|
||||||
{switch name="vo.status"}
|
|
||||||
{case value="0"}<span style="color:red;">草稿</span>{/case}
|
|
||||||
{case value="1"}<span style="color:orange;">待审核</span>{/case}
|
|
||||||
{case value="2"}<span style="color:green;">已发布</span>{/case}
|
|
||||||
{case value="3"}<span style="color:gray;">隐藏</span>{/case}
|
|
||||||
{/switch}
|
|
||||||
</td>
|
|
||||||
<td>{$vo.publishdate}</td>
|
|
||||||
<td>
|
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="edit({$vo.id})">
|
|
||||||
<i class="layui-icon layui-icon-edit"></i>编辑
|
|
||||||
</button>
|
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="del({$vo.id})">
|
|
||||||
<i class="layui-icon layui-icon-delete"></i>删除
|
|
||||||
</button>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
{/volist}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<script type="text/html" id="imageTemplate">
|
||||||
|
{{# if(d.image){ }}
|
||||||
|
<img src="{{ d.image }}" 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-primary 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">
|
<script type="text/javascript">
|
||||||
layui.use(['layer'], function () {
|
layui.use(['layer', 'form', 'table'], function () {
|
||||||
layer = layui.layer;
|
var layer = layui.layer;
|
||||||
$ = layui.jquery;
|
var $ = layui.jquery;
|
||||||
|
var form = layui.form;
|
||||||
|
var table = layui.table;
|
||||||
|
|
||||||
|
// 初始化表格
|
||||||
|
table.render({
|
||||||
|
elem: '#articleTable',
|
||||||
|
url: '/admin/article/articlelist',
|
||||||
|
method: 'post',
|
||||||
|
cols: [[
|
||||||
|
{field: 'id', title: 'ID', align:'center', width: 80},
|
||||||
|
{field: 'title', title: '标题'},
|
||||||
|
{field: 'cate', title: '分类', align:'center', width: 180},
|
||||||
|
{field: 'image', title: '封面', templet: '#imageTemplate', align:'center', width: 180},
|
||||||
|
{field: 'author', title: '作者', align:'center', width: 120},
|
||||||
|
{field: 'status', title: '状态', templet: '#statusTemplate', align:'center', width: 80},
|
||||||
|
{field: 'publishdate', title: '发布时间', align:'center', width: 180},
|
||||||
|
{title: '操作', toolbar: '#operationBar', align:'center', width: 150}
|
||||||
|
]],
|
||||||
|
page: true,
|
||||||
|
limit: 20,
|
||||||
|
limits: [10, 20, 30, 50],
|
||||||
|
//height: 'full-220'
|
||||||
|
});
|
||||||
|
|
||||||
|
// 监听工具条事件
|
||||||
|
table.on('tool(articleTable)', 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) {
|
||||||
|
if (!categoryId) {
|
||||||
|
layui.table.reload('articleTable', {
|
||||||
|
where: {},
|
||||||
|
page: {
|
||||||
|
curr: 1
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var categoryName = $('#categoryFilter option[value="' + categoryId + '"]').text();
|
||||||
|
layui.table.reload('articleTable', {
|
||||||
|
where: {
|
||||||
|
category: categoryName
|
||||||
|
},
|
||||||
|
page: {
|
||||||
|
curr: 1
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function add() {
|
function add() {
|
||||||
window.location.href = '{:url("article/add")}';
|
window.location.href = '/admin/article/add';
|
||||||
}
|
}
|
||||||
|
|
||||||
function edit(id) {
|
function edit(id) {
|
||||||
window.location.href = '{:url("article/edit")}?id=' + id;
|
window.location.href = '/admin/article/edit?id=' + id;
|
||||||
}
|
}
|
||||||
|
|
||||||
function del(id) {
|
function del(id) {
|
||||||
layer.confirm('确定要删除该文章吗？', {
|
layer.confirm('确定要删除该文章吗？', {
|
||||||
btn: ['确定', '取消']
|
btn: ['确定', '取消']
|
||||||
}, function () {
|
}, function () {
|
||||||
$.post('{:url("article/delete")}', { id: id }, function (res) {
|
$.post('/admin/article/delete', { id: id }, function (res) {
|
||||||
if (res.code == 0) {
|
if (res.code == 0) {
|
||||||
layer.msg(res.msg, { icon: 1 });
|
layer.msg(res.msg, { icon: 1 });
|
||||||
setTimeout(function () {
|
setTimeout(function () {
|
||||||
window.location.reload();
|
layui.table.reload('articleTable');
|
||||||
}, 1000);
|
}, 1000);
|
||||||
} else {
|
} else {
|
||||||
layer.msg(res.msg, { icon: 2 });
|
layer.msg(res.msg, { icon: 2 });
|
||||||
@ -94,6 +153,6 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
function refresh() {
|
function refresh() {
|
||||||
window.location.reload();
|
layui.table.reload('articleTable');
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@ -33,3 +33,9 @@
|
|||||||
background: #e9ecef;
|
background: #e9ecef;
|
||||||
color: #409eff;
|
color: #409eff;
|
||||||
}
|
}
|
||||||
|
.shaixuan {
|
||||||
|
margin-left: 20px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
@ -1,4 +1,4 @@
|
|||||||
<?php /*a:2:{s:57:"E:\Demo\PHP\yunzer\app\admin\view\article\articlelist.php";i:1746800071;s:51:"E:\Demo\PHP\yunzer\app\admin\view\public\header.php";i:1746890051;}*/ ?>
|
<?php /*a:2:{s:57:"E:\Demo\PHP\yunzer\app\admin\view\article\articlelist.php";i:1747323773;s:51:"E:\Demo\PHP\yunzer\app\admin\view\public\header.php";i:1746890051;}*/ ?>
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
@ -95,8 +95,25 @@
|
|||||||
<body style="padding:10px; box-sizing: border-box;">
|
<body style="padding:10px; box-sizing: border-box;">
|
||||||
<div class="config-container">
|
<div class="config-container">
|
||||||
<div class="config-header" style="display:flex;justify-content: space-between;">
|
<div class="config-header" style="display:flex;justify-content: space-between;">
|
||||||
<div>
|
<div style="display: flex; align-items: center;">
|
||||||
<span>文章列表</span>
|
<span>文章列表</span>
|
||||||
|
<div class="shaixuan">
|
||||||
|
<label>筛选：</label>
|
||||||
|
<div class="layui-form">
|
||||||
|
<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>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="add()">
|
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="add()">
|
||||||
@ -108,73 +125,119 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<table class="layui-table">
|
<table id="articleTable" lay-filter="articleTable"></table>
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th width="20">ID</th>
|
|
||||||
<th>标题</th>
|
|
||||||
<th>分类</th>
|
|
||||||
<th>封面</th>
|
|
||||||
<th>作者</th>
|
|
||||||
<th>状态</th>
|
|
||||||
<th>发布时间</th>
|
|
||||||
<th>操作</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<?php if(is_array($lists) || $lists instanceof \think\Collection || $lists instanceof \think\Paginator): $i = 0; $__LIST__ = $lists;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$vo): $mod = ($i % 2 );++$i;?>
|
|
||||||
<tr>
|
|
||||||
<td><?php echo htmlentities((string) $vo['id']); ?></td>
|
|
||||||
<td><?php echo htmlentities((string) $vo['title']); ?></td>
|
|
||||||
<td><?php echo htmlentities((string) $vo['cate']); ?></td>
|
|
||||||
<td>
|
|
||||||
<?php if($vo['image']): ?>
|
|
||||||
<img src="<?php echo htmlentities((string) $vo['image']); ?>" style="max-width: 50px; max-height: 50px;">
|
|
||||||
<?php endif; ?>
|
|
||||||
</td>
|
|
||||||
<td><?php echo htmlentities((string) $vo['author']); ?></td>
|
|
||||||
<td>
|
|
||||||
<?php switch($vo['status']): case "0": ?><span style="color:red;">草稿</span><?php break; case "1": ?><span style="color:orange;">待审核</span><?php break; case "2": ?><span style="color:green;">已发布</span><?php break; case "3": ?><span style="color:gray;">隐藏</span><?php break; ?>
|
|
||||||
<?php endswitch; ?>
|
|
||||||
</td>
|
|
||||||
<td><?php echo htmlentities((string) $vo['publishdate']); ?></td>
|
|
||||||
<td>
|
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="edit(<?php echo htmlentities((string) $vo['id']); ?>)">
|
|
||||||
<i class="layui-icon layui-icon-edit"></i>编辑
|
|
||||||
</button>
|
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="del(<?php echo htmlentities((string) $vo['id']); ?>)">
|
|
||||||
<i class="layui-icon layui-icon-delete"></i>删除
|
|
||||||
</button>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<?php endforeach; endif; else: echo "" ;endif; ?>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<script type="text/html" id="imageTemplate">
|
||||||
|
{{# if(d.image){ }}
|
||||||
|
<img src="{{ d.image }}" 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-primary 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">
|
<script type="text/javascript">
|
||||||
layui.use(['layer'], function () {
|
layui.use(['layer', 'form', 'table'], function () {
|
||||||
layer = layui.layer;
|
var layer = layui.layer;
|
||||||
$ = layui.jquery;
|
var $ = layui.jquery;
|
||||||
|
var form = layui.form;
|
||||||
|
var table = layui.table;
|
||||||
|
|
||||||
|
// 初始化表格
|
||||||
|
table.render({
|
||||||
|
elem: '#articleTable',
|
||||||
|
url: '/admin/article/articlelist',
|
||||||
|
method: 'post',
|
||||||
|
cols: [[
|
||||||
|
{field: 'id', title: 'ID', align:'center', width: 80},
|
||||||
|
{field: 'title', title: '标题'},
|
||||||
|
{field: 'cate', title: '分类', align:'center', width: 180},
|
||||||
|
{field: 'image', title: '封面', templet: '#imageTemplate', align:'center', width: 180},
|
||||||
|
{field: 'author', title: '作者', align:'center', width: 120},
|
||||||
|
{field: 'status', title: '状态', templet: '#statusTemplate', align:'center', width: 80},
|
||||||
|
{field: 'publishdate', title: '发布时间', align:'center', width: 180},
|
||||||
|
{title: '操作', toolbar: '#operationBar', align:'center', width: 150}
|
||||||
|
]],
|
||||||
|
page: true,
|
||||||
|
limit: 20,
|
||||||
|
limits: [10, 20, 30, 50],
|
||||||
|
//height: 'full-220'
|
||||||
|
});
|
||||||
|
|
||||||
|
// 监听工具条事件
|
||||||
|
table.on('tool(articleTable)', 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) {
|
||||||
|
if (!categoryId) {
|
||||||
|
layui.table.reload('articleTable', {
|
||||||
|
where: {},
|
||||||
|
page: {
|
||||||
|
curr: 1
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var categoryName = $('#categoryFilter option[value="' + categoryId + '"]').text();
|
||||||
|
layui.table.reload('articleTable', {
|
||||||
|
where: {
|
||||||
|
category: categoryName
|
||||||
|
},
|
||||||
|
page: {
|
||||||
|
curr: 1
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function add() {
|
function add() {
|
||||||
window.location.href = '<?php echo url("article/add"); ?>';
|
window.location.href = '/admin/article/add';
|
||||||
}
|
}
|
||||||
|
|
||||||
function edit(id) {
|
function edit(id) {
|
||||||
window.location.href = '<?php echo url("article/edit"); ?>?id=' + id;
|
window.location.href = '/admin/article/edit?id=' + id;
|
||||||
}
|
}
|
||||||
|
|
||||||
function del(id) {
|
function del(id) {
|
||||||
layer.confirm('确定要删除该文章吗？', {
|
layer.confirm('确定要删除该文章吗？', {
|
||||||
btn: ['确定', '取消']
|
btn: ['确定', '取消']
|
||||||
}, function () {
|
}, function () {
|
||||||
$.post('<?php echo url("article/delete"); ?>', { id: id }, function (res) {
|
$.post('/admin/article/delete', { id: id }, function (res) {
|
||||||
if (res.code == 0) {
|
if (res.code == 0) {
|
||||||
layer.msg(res.msg, { icon: 1 });
|
layer.msg(res.msg, { icon: 1 });
|
||||||
setTimeout(function () {
|
setTimeout(function () {
|
||||||
window.location.reload();
|
layui.table.reload('articleTable');
|
||||||
}, 1000);
|
}, 1000);
|
||||||
} else {
|
} else {
|
||||||
layer.msg(res.msg, { icon: 2 });
|
layer.msg(res.msg, { icon: 2 });
|
||||||
@ -184,6 +247,6 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
function refresh() {
|
function refresh() {
|
||||||
window.location.reload();
|
layui.table.reload('articleTable');
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@ -1,4 +1,4 @@
|
|||||||
<?php /*a:2:{s:57:"E:\Demo\PHP\yunzer\app\admin\view\article\articlecate.php";i:1746890051;s:51:"E:\Demo\PHP\yunzer\app\admin\view\public\header.php";i:1746890051;}*/ ?>
|
<?php /*a:2:{s:57:"E:\Demo\PHP\yunzer\app\admin\view\article\articlecate.php";i:1747325751;s:51:"E:\Demo\PHP\yunzer\app\admin\view\public\header.php";i:1746890051;}*/ ?>
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
@ -95,8 +95,8 @@
|
|||||||
<body style="padding:10px; box-sizing: border-box;">
|
<body style="padding:10px; box-sizing: border-box;">
|
||||||
<div class="config-container">
|
<div class="config-container">
|
||||||
<div class="config-header" style="display:flex;justify-content: space-between;">
|
<div class="config-header" style="display:flex;justify-content: space-between;">
|
||||||
<div>
|
<div style="display: flex; align-items: center;">
|
||||||
<span>文章分类列表</span>
|
<span>文章分类</span>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="add()">
|
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="add()">
|
||||||
@ -108,125 +108,390 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<table class="layui-table">
|
<div class="layui-row" style="margin-top: 15px;">
|
||||||
<thead>
|
<div class="layui-col-md6">
|
||||||
<tr>
|
<div class="layui-card">
|
||||||
<th width="20">ID</th>
|
<div class="layui-card-header">分类列表</div>
|
||||||
<th width="120">分类名称</th>
|
<div class="layui-card-body">
|
||||||
<th width="120">分类图片</th>
|
<div id="categoryList"></div>
|
||||||
<th>描述</th>
|
</div>
|
||||||
<th width="80">排序</th>
|
</div>
|
||||||
<th width="80">状态</th>
|
</div>
|
||||||
<th width="180">创建时间</th>
|
<div class="layui-col-md4"">
|
||||||
<th width="240">操作</th>
|
<div class="layui-card">
|
||||||
</tr>
|
<div class="layui-card-header">分类信息</div>
|
||||||
</thead>
|
<div class="layui-card-body">
|
||||||
<tbody>
|
<div id="defaultTip" style="text-align: center; padding: 50px 0; color: #999;">
|
||||||
<?php if(is_array($lists) || $lists instanceof \think\Collection || $lists instanceof \think\Paginator): $i = 0; $__LIST__ = $lists;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$vo): $mod = ($i % 2 );++$i;if($vo['cid'] == 0): ?>
|
<i class="layui-icon layui-icon-face-surprised" style="font-size: 30px;"></i>
|
||||||
<tr>
|
<p style="margin-top: 10px;">请选择左侧分类</p>
|
||||||
<td><?php echo htmlentities((string) $vo['id']); ?></td>
|
</div>
|
||||||
<td><?php echo htmlentities((string) $vo['name']); ?></td>
|
<form class="layui-form" lay-filter="categoryForm" style="display: none;">
|
||||||
<td><img src="<?php echo htmlentities((string) $vo['image']); ?>" style="width: 100px;height: auto;"></td>
|
<input type="hidden" name="id" id="categoryId">
|
||||||
<td></td><?php echo htmlentities((string) $vo['desc']); ?></td>
|
<div class="layui-form-item">
|
||||||
<td><?php echo htmlentities((string) $vo['sort']); ?></td>
|
<label class="layui-form-label">分类名称</label>
|
||||||
<td><?php echo $vo['status']==1 ? '开启' : '<span style="color:red;">禁用</span>'; ?></td>
|
<div class="layui-input-block">
|
||||||
<td><?php echo htmlentities((string) $vo['create_time']); ?></td>
|
<input type="text" name="name" required lay-verify="required" placeholder="请输入分类名称"
|
||||||
<td>
|
autocomplete="off" class="layui-input">
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs"
|
</div>
|
||||||
onclick="addchanel(<?php echo htmlentities((string) $vo['id']); ?>)">
|
</div>
|
||||||
<i class="layui-icon layui-icon-add-1"></i>添加子栏目
|
<div class="layui-form-item">
|
||||||
</button>
|
<label class="layui-form-label">父级分类</label>
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="edit(<?php echo htmlentities((string) $vo['id']); ?>)">
|
<div class="layui-input-block">
|
||||||
<i class="layui-icon layui-icon-edit"></i>编辑
|
<select name="cid" lay-verify="required">
|
||||||
</button>
|
<option value="0">顶级分类</option>
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="del(<?php echo htmlentities((string) $vo['id']); ?>)">
|
</select>
|
||||||
<i class="layui-icon layui-icon-delete"></i>删除
|
</div>
|
||||||
</button>
|
</div>
|
||||||
</td>
|
<div class="layui-form-item">
|
||||||
</tr>
|
<label class="layui-form-label">封面图片</label>
|
||||||
<?php if(is_array($lists) || $lists instanceof \think\Collection || $lists instanceof \think\Paginator): $i = 0; $__LIST__ = $lists;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$sub): $mod = ($i % 2 );++$i;if($sub['cid'] == $vo['id']): ?>
|
<div class="layui-input-block">
|
||||||
<tr>
|
<input type="text" name="image" placeholder="请输入图片地址" autocomplete="off"
|
||||||
<td><?php echo htmlentities((string) $sub['id']); ?></td>
|
class="layui-input" id="imageInput">
|
||||||
<td style="padding-left: 30px;">├─ <?php echo htmlentities((string) $sub['name']); ?></td>
|
<div class="layui-upload" style="margin-top: 20px;">
|
||||||
<td><img src="<?php echo htmlentities((string) $sub['image']); ?>" style="width: 100px;height: auto;"></td>
|
<div>
|
||||||
<td><?php echo htmlentities((string) $sub['desc']); ?></td>
|
<button type="button" class="layui-btn" id="uploadImage">上传图片</button>
|
||||||
<td><?php echo htmlentities((string) $sub['sort']); ?></td>
|
<span style="color: #999; margin-left: 10px;">建议尺寸：250px*140px</span>
|
||||||
<td><?php echo $sub['status']==1 ? '开启' : '<span style="color:red;">禁用</span>'; ?></td>
|
</div>
|
||||||
<td><?php echo htmlentities((string) $sub['create_time']); ?></td>
|
<div class="layui-upload-list">
|
||||||
<td>
|
<img class="layui-upload-img" id="imagePreview" style="margin-top: 10px;">
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="edit(<?php echo htmlentities((string) $sub['id']); ?>)">
|
<i class="layui-icon layui-icon-close delete-image"
|
||||||
<i class="layui-icon layui-icon-edit"></i>编辑
|
style="display: none; position: absolute; top: 0; right: 0; cursor: pointer; color: #FF5722;"></i>
|
||||||
</button>
|
</div>
|
||||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="del(<?php echo htmlentities((string) $sub['id']); ?>)">
|
</div>
|
||||||
<i class="layui-icon layui-icon-delete"></i>删除
|
</div>
|
||||||
</button>
|
</div>
|
||||||
</td>
|
<div class="layui-form-item">
|
||||||
</tr>
|
<label class="layui-form-label">排序</label>
|
||||||
<?php endif; ?>
|
<div class="layui-input-block">
|
||||||
<?php endforeach; endif; else: echo "" ;endif; ?>
|
<input type="number" name="sort" value="0" class="layui-input">
|
||||||
<?php endif; ?>
|
</div>
|
||||||
<?php endforeach; endif; else: echo "" ;endif; ?>
|
</div>
|
||||||
</tbody>
|
<div class="layui-form-item">
|
||||||
</table>
|
<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">
|
||||||
|
<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>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
layui.use(['layer'], function () {
|
layui.use(['layer', 'form', 'util', 'upload'], function () {
|
||||||
layer = layui.layer;
|
var layer = layui.layer;
|
||||||
$ = layui.jquery;
|
var $ = layui.jquery;
|
||||||
});
|
var form = layui.form;
|
||||||
|
var util = layui.util;
|
||||||
|
var upload = layui.upload;
|
||||||
|
|
||||||
function add() {
|
// 初始化分类列表
|
||||||
layer.open({
|
function initCategoryList() {
|
||||||
type: 2,
|
$.ajax({
|
||||||
title: '添加分类',
|
url: '/admin/article/articlecate',
|
||||||
shadeClose: true,
|
type: 'POST',
|
||||||
shade: 0.8,
|
success: function (res) {
|
||||||
area: ['800px', '600px'],
|
if (res.code === 0) {
|
||||||
content: '<?php echo url("article/cateadd"); ?>'
|
var html = '';
|
||||||
});
|
res.data.forEach(function (item) {
|
||||||
}
|
html += renderCategory(item);
|
||||||
|
});
|
||||||
|
$('#categoryList').html(html);
|
||||||
|
bindEvents();
|
||||||
|
} else {
|
||||||
|
layer.msg('获取分类数据失败', { icon: 2 });
|
||||||
|
}
|
||||||
|
},
|
||||||
|
error: function () {
|
||||||
|
layer.msg('请求失败，请重试', { icon: 2 });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function edit(id) {
|
// 渲染分类
|
||||||
layer.open({
|
function renderCategory(category, level = 0) {
|
||||||
type: 2,
|
var html = '<div class="category-item" data-id="' + category.id + '">';
|
||||||
title: '编辑分类',
|
html += '<div class="category-header">';
|
||||||
shadeClose: true,
|
html += '<span class="category-name">' + category.title + '</span>';
|
||||||
shade: 0.8,
|
html += '<div class="category-actions">';
|
||||||
area: ['800px', '800px'],
|
// 只有一级分类才显示添加按钮
|
||||||
content: '<?php echo url("article/cateedit"); ?>?id=' + id
|
if (level === 0) {
|
||||||
});
|
html += '<i class="layui-icon layui-icon-add-1 add-child" title="添加子分类"></i>';
|
||||||
}
|
}
|
||||||
|
html += '</div>';
|
||||||
|
html += '</div>';
|
||||||
|
|
||||||
function del(id) {
|
if (category.children && category.children.length > 0) {
|
||||||
layer.confirm('确定要删除该分类吗？', {
|
html += '<div class="category-children">';
|
||||||
btn: ['确定', '取消']
|
category.children.forEach(function (child) {
|
||||||
}, function () {
|
html += renderCategory(child, level + 1);
|
||||||
$.post('<?php echo url("article/catedel"); ?>', { id: id }, function (res) {
|
});
|
||||||
if (res.code == 0) {
|
html += '</div>';
|
||||||
|
}
|
||||||
|
|
||||||
|
html += '</div>';
|
||||||
|
return html;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 绑定事件
|
||||||
|
function bindEvents() {
|
||||||
|
// 点击分类
|
||||||
|
$('.category-name').off('click').on('click', function () {
|
||||||
|
var id = $(this).closest('.category-item').data('id');
|
||||||
|
loadCategoryInfo(id);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 点击添加子分类
|
||||||
|
$('.add-child').off('click').on('click', function (e) {
|
||||||
|
e.stopPropagation();
|
||||||
|
var id = $(this).closest('.category-item').data('id');
|
||||||
|
$('#categoryId').val('');
|
||||||
|
$('select[name="cid"]').val(id);
|
||||||
|
$('#deleteBtn').hide();
|
||||||
|
form.render();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 加载分类信息
|
||||||
|
function loadCategoryInfo(id) {
|
||||||
|
$('#defaultTip').hide();
|
||||||
|
$('form.layui-form').show();
|
||||||
|
|
||||||
|
$.get('/admin/article/cateedit?id=' + id, function (res) {
|
||||||
|
if (res.code === 0) {
|
||||||
|
// 更新父级分类选项
|
||||||
|
var $select = $('select[name="cid"]');
|
||||||
|
$select.empty();
|
||||||
|
$select.append('<option value="0">顶级分类</option>');
|
||||||
|
res.data.parentOptions.forEach(function (item) {
|
||||||
|
$select.append('<option value="' + item.id + '">' + item.name + '</option>');
|
||||||
|
});
|
||||||
|
|
||||||
|
// 填充表单数据
|
||||||
|
form.val('categoryForm', res.data.info);
|
||||||
|
|
||||||
|
// 显示图片预览
|
||||||
|
if (res.data.info.image) {
|
||||||
|
$('#imagePreview').attr('src', res.data.info.image);
|
||||||
|
$('.delete-image').show();
|
||||||
|
} else {
|
||||||
|
$('#imagePreview').attr('src', '');
|
||||||
|
$('.delete-image').hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
// 显示删除按钮
|
||||||
|
$('#deleteBtn').show();
|
||||||
|
|
||||||
|
// 重新渲染表单
|
||||||
|
form.render();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 初始化
|
||||||
|
initCategoryList();
|
||||||
|
|
||||||
|
// 默认显示提示信息
|
||||||
|
$('#defaultTip').show();
|
||||||
|
$('form.layui-form').hide();
|
||||||
|
|
||||||
|
// 监听表单提交
|
||||||
|
form.on('submit(saveCategory)', function (data) {
|
||||||
|
var url = data.field.id ? '/admin/article/cateedit' : '/admin/article/cateadd';
|
||||||
|
$.post(url, data.field, function (res) {
|
||||||
|
if (res.code === 0) {
|
||||||
layer.msg(res.msg, { icon: 1 });
|
layer.msg(res.msg, { icon: 1 });
|
||||||
setTimeout(function () {
|
initCategoryList();
|
||||||
window.location.reload();
|
|
||||||
}, 1000);
|
|
||||||
} else {
|
} else {
|
||||||
layer.msg(res.msg, { icon: 2 });
|
layer.msg(res.msg, { icon: 2 });
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
return false;
|
||||||
});
|
});
|
||||||
}
|
|
||||||
|
|
||||||
function addchanel(id) {
|
// 监听删除按钮点击
|
||||||
layer.open({
|
$('#deleteBtn').on('click', function () {
|
||||||
type: 2,
|
var id = $('input[name="id"]').val();
|
||||||
title: '添加子栏目',
|
if (!id) return;
|
||||||
shadeClose: true,
|
|
||||||
shade: 0.8,
|
layer.confirm('确定要删除该分类吗？', {
|
||||||
area: ['800px', '600px'],
|
btn: ['确定', '取消']
|
||||||
content: '<?php echo url("article/cateadd"); ?>?cid=' + id
|
}, function () {
|
||||||
|
$.post('/admin/article/catedel', { id: id }, function (res) {
|
||||||
|
if (res.code == 0) {
|
||||||
|
layer.msg(res.msg, { icon: 1 });
|
||||||
|
initCategoryList();
|
||||||
|
// 重置表单
|
||||||
|
form.val('categoryForm', {
|
||||||
|
id: '',
|
||||||
|
name: '',
|
||||||
|
cid: '0',
|
||||||
|
image: '',
|
||||||
|
sort: 0,
|
||||||
|
status: 1
|
||||||
|
});
|
||||||
|
$('#imagePreview').attr('src', '');
|
||||||
|
$('#deleteBtn').hide();
|
||||||
|
form.render();
|
||||||
|
} else {
|
||||||
|
layer.msg(res.msg, { icon: 2 });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// 图片上传
|
||||||
|
upload.render({
|
||||||
|
elem: '#uploadImage',
|
||||||
|
url: '/admin/upload/image', // 替换为实际的上传接口
|
||||||
|
accept: 'images',
|
||||||
|
acceptMime: 'image/*',
|
||||||
|
done: function (res) {
|
||||||
|
if (res.code === 0) {
|
||||||
|
$('#imageInput').val(res.data.url);
|
||||||
|
$('#imagePreview').attr('src', res.data.url);
|
||||||
|
layer.msg('上传成功');
|
||||||
|
} else {
|
||||||
|
layer.msg('上传失败');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// 监听图片输入框变化
|
||||||
|
$('#imageInput').on('input', function () {
|
||||||
|
var url = $(this).val();
|
||||||
|
if (url) {
|
||||||
|
$('#imagePreview').attr('src', url);
|
||||||
|
$('.delete-image').show();
|
||||||
|
} else {
|
||||||
|
$('#imagePreview').attr('src', '');
|
||||||
|
$('.delete-image').hide();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// 监听图片删除按钮点击
|
||||||
|
$(document).on('click', '.delete-image', function () {
|
||||||
|
$('#imageInput').val('');
|
||||||
|
$('#imagePreview').attr('src', '');
|
||||||
|
$(this).hide();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
function add() {
|
||||||
|
$('#defaultTip').hide();
|
||||||
|
$('form.layui-form').show();
|
||||||
|
|
||||||
|
// 重置表单
|
||||||
|
layui.form.val('categoryForm', {
|
||||||
|
id: '',
|
||||||
|
name: '',
|
||||||
|
cid: '0',
|
||||||
|
image: '',
|
||||||
|
sort: 0,
|
||||||
|
status: 1
|
||||||
|
});
|
||||||
|
$('#imagePreview').attr('src', '');
|
||||||
|
$('.delete-image').hide();
|
||||||
|
$('#deleteBtn').hide();
|
||||||
|
layui.form.render();
|
||||||
}
|
}
|
||||||
|
|
||||||
function refresh() {
|
function refresh() {
|
||||||
window.location.reload();
|
initCategoryList();
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.category-item {
|
||||||
|
margin: 5px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 8px 10px;
|
||||||
|
background-color: #f8f8f8;
|
||||||
|
border-radius: 2px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-header:hover {
|
||||||
|
background-color: #f2f2f2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-name {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-actions {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-header:hover .category-actions {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-children {
|
||||||
|
margin-left: 20px;
|
||||||
|
padding-left: 10px;
|
||||||
|
border-left: 1px solid #e6e6e6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-child {
|
||||||
|
color: #1E9FFF;
|
||||||
|
font-size: 14px;
|
||||||
|
cursor: pointer;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-child:hover {
|
||||||
|
color: #0C7CD5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.layui-upload-list {
|
||||||
|
margin-top: 10px;
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.delete-image {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
cursor: pointer;
|
||||||
|
color: #FF5722;
|
||||||
|
font-size: 20px;
|
||||||
|
background: rgba(255, 255, 255, 0.8);
|
||||||
|
border-radius: 50%;
|
||||||
|
padding: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.delete-image:hover {
|
||||||
|
color: #FF0000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.layui-card {
|
||||||
|
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
|
||||||
|
}
|
||||||
|
|
||||||
|
.layui-col-md4{
|
||||||
|
width: 40%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.layui-col-md6{
|
||||||
|
width: 60%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -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:1746986804;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: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;}*/ ?>
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
|
|
||||||
@ -203,7 +203,7 @@ layui.use(['carousel', 'form'], function(){
|
|||||||
<div class="module-header">
|
<div class="module-header">
|
||||||
<div>
|
<div>
|
||||||
<div class="ModuleTitle_titleWrapper">
|
<div class="ModuleTitle_titleWrapper">
|
||||||
<h3 class="ModuleTitle_title">技术文章</h3>
|
<h3 class="ModuleTitle_title">技术文章11</h3>
|
||||||
<div class="tab-container">
|
<div class="tab-container">
|
||||||
<div class="tab-header">
|
<div class="tab-header">
|
||||||
<div class="tab-item active" data-tab="all">全部</div>
|
<div class="tab-item active" data-tab="all">全部</div>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user