优化搜索界面及控制器
This commit is contained in:
@@ -19,29 +19,24 @@
|
||||
{if $items}
|
||||
{volist name="items" id="item"}
|
||||
<div class="layui-col-md12">
|
||||
<div class="layui-card">
|
||||
<div class="layui-card-body">
|
||||
<div style="display: flex; align-items: center;">
|
||||
<div style="margin-right: 20px;">
|
||||
{if $type == 'article'}
|
||||
<img src="{$item.image}" alt="{$item.title}" style="width: 250px; height: 140px; object-fit: cover;">
|
||||
{else}
|
||||
<img src="{$item.icon}" alt="{$item.title}" style="width: 250px; height: 140px; object-fit: cover;">
|
||||
{/if}
|
||||
</div>
|
||||
<div class="layui-col-md8">
|
||||
<h3 class="layui-text">
|
||||
<a href="{$detailUrl}?id={$item.id}" class="layui-text" style="color: #333;">{$item.title}</a>
|
||||
</h3>
|
||||
<div class="layui-text" style="margin: 10px 0;">
|
||||
<span class="layui-badge layui-bg-gray">{$item.category.name}</span>
|
||||
<span class="layui-badge layui-bg-gray">{$item.author}</span>
|
||||
<span class="layui-badge layui-bg-gray">{$item.publishdate|date="Y-m-d"}</span>
|
||||
</div>
|
||||
<div class="layui-text" style="margin-top: 10px;">
|
||||
<a href="{$detailUrl}?id={$item.id}" class="layui-btn layui-btn-sm layui-btn-normal">查看详情</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="search-result-item" onclick="window.location.href='<?php echo $type == 'article' ? url('article/detail', ['id' => $item['id']]) : $item['detail_url'] ?>'">
|
||||
<div class="search-result-image">
|
||||
<?php if($type == 'article'): ?>
|
||||
<img src="<?php echo $item['image'] ?: '/static/images/default.jpg' ?>" alt="<?php echo $item['title'] ?>">
|
||||
<?php else: ?>
|
||||
<img src="<?php echo $item['icon'] ?: '/static/images/default.jpg' ?>" alt="<?php echo $item['title'] ?>">
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<div class="search-result-content">
|
||||
<h3 class="search-result-title"><?php echo $item['title'] ?></h3>
|
||||
<div class="search-result-meta">
|
||||
<span class="layui-badge layui-bg-blue"><?php echo $item['cate'] ?></span>
|
||||
<?php if($type == 'article'): ?>
|
||||
<span class="layui-badge layui-bg-green">作者:<?php echo $item['author'] ?></span>
|
||||
<?php else: ?>
|
||||
<span class="layui-badge layui-bg-green">上传者:<?php echo $item['uploader'] ?></span>
|
||||
<?php endif; ?>
|
||||
<span class="layui-badge layui-bg-gray"><?php echo $item['publishdate'] ?></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -85,4 +80,53 @@ layui.use(['laypage'], function(){
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.search-result-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 15px;
|
||||
transition: all 0.3s ease;
|
||||
border-radius: 4px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.search-result-item:hover {
|
||||
background-color:rgb(255, 255, 255);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 2px 8px rgba(0, 174, 255, 0.5);
|
||||
}
|
||||
|
||||
.search-result-image {
|
||||
margin-right: 20px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.search-result-image img {
|
||||
width: 250px;
|
||||
height: 140px;
|
||||
object-fit: cover;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.search-result-content {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.search-result-title {
|
||||
font-size: 18px;
|
||||
color: #333;
|
||||
margin: 0 0 10px 0;
|
||||
}
|
||||
|
||||
.search-result-meta {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.search-result-meta .layui-badge {
|
||||
margin-right: 5px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user