基础样式交互完成

This commit is contained in:
2025-05-29 18:29:46 +08:00
parent b32e055c7f
commit 01cea56a6a
4 changed files with 20 additions and 8 deletions
@@ -32,9 +32,15 @@ export function CompactSearchBox({
}; };
const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => { const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {
if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) { if (e.key === 'Enter') {
e.preventDefault(); if (e.shiftKey) {
handleSearch(); // Shift+回车:允许换行,不做任何处理
return;
} else {
// 单独回车:触发搜索
e.preventDefault();
handleSearch();
}
} }
}; };
@@ -32,9 +32,15 @@ export function ContractSearchHero({
}; };
const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => { const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {
if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) { if (e.key === 'Enter') {
e.preventDefault(); if (e.shiftKey) {
handleSearch(); // Shift+回车:允许换行,不做任何处理
return;
} else {
// 单独回车:触发搜索
e.preventDefault();
handleSearch();
}
} }
}; };
@@ -27,7 +27,7 @@ export default function ContractTemplateSearchIndex() {
// 模拟分类数据 // 模拟分类数据
const categories = [ const categories = [
{ name: '销售合同', icon: 'ri-handshake-line', count: 128 }, { name: '销售合同', icon: 'ri-contract-line', count: 128 },
{ name: '采购合同', icon: 'ri-shopping-cart-line', count: 96 }, { name: '采购合同', icon: 'ri-shopping-cart-line', count: 96 },
{ name: '物流运输', icon: 'ri-truck-line', count: 64 }, { name: '物流运输', icon: 'ri-truck-line', count: 64 },
{ name: '人事劳务', icon: 'ri-user-settings-line', count: 52 }, { name: '人事劳务', icon: 'ri-user-settings-line', count: 52 },
+1 -1
View File
@@ -804,7 +804,7 @@
为您找到 <span class="result-count">24</span> 个相关模板 为您找到 <span class="result-count">24</span> 个相关模板
</div> </div>
<div class="flex items-center gap-4"> <div class="flex items-center gap-4">
<select class="px-3 py-2 border border-gray-200 rounded-lg text-sm"> <select class="px-3 py-3 border border-gray-200 rounded-lg text-sm">
<option>相关度排序</option> <option>相关度排序</option>
<option>最新更新</option> <option>最新更新</option>
<option>使用频率</option> <option>使用频率</option>