合同初步可以访问

2025-05-29 17:42:35 +08:00
parent 9200654c35
commit b92d87a3b4
16 changed files with 2239 additions and 0 deletions
@@ -0,0 +1,77 @@
+import type { MetaFunction } from '@remix-run/node';
+import { useNavigate } from '@remix-run/react';
+import { ContractSearchHero } from '~/components/contract-template/ContractSearchHero';
+import styles from '~/styles/pages/contract-template.css?url';
+
+export const links = () => [
+  { rel: 'stylesheet', href: styles }
+];
+
+export const meta: MetaFunction = () => {
+  return [
+    { title: 'AI智能合同模板搜索 - 智慧法务' },
+    { 
+      name: 'description', 
+      content: '使用AI智能搜索快速找到最适合的合同模板，支持自然语言描述搜索。' 
+    }
+  ];
+};
+
+// 面包屑导航配置
+export const handle = {
+  breadcrumb: "智能搜索"
+};
+
+export default function ContractTemplateSearchIndex() {
+  const navigate = useNavigate();
+  
+  // 模拟分类数据
+  const categories = [
+    { name: '销售合同', icon: 'ri-handshake-line', count: 128 },
+    { name: '采购合同', icon: 'ri-shopping-cart-line', count: 96 },
+    { name: '物流运输', icon: 'ri-truck-line', count: 64 },
+    { name: '人事劳务', icon: 'ri-user-settings-line', count: 52 },
+    { name: '租赁合同', icon: 'ri-building-line', count: 38 },
+    { name: '保密协议', icon: 'ri-shield-check-line', count: 24 }
+  ];
+
+  const handleSearch = (query: string) => {
+    if (query.trim()) {
+      navigate(`/contract-template/search/results?q=${encodeURIComponent(query)}`);
+    }
+  };
+
+  const handleCategoryClick = (categoryName: string) => {
+    navigate(`/contract-template/list?category=${encodeURIComponent(categoryName)}`);
+  };
+
+  return (
+    <div className="contract-template-search">
+      <ContractSearchHero onSearch={handleSearch} />
+      <div className="quick-categories">
+        {categories.map((category, index) => (
+          <div 
+            key={index}
+            className="category-card"
+            onClick={() => handleCategoryClick(category.name)}
+            onKeyDown={(e) => {
+              if (e.key === 'Enter' || e.key === ' ') {
+                e.preventDefault();
+                handleCategoryClick(category.name);
+              }
+            }}
+            role="button"
+            tabIndex={0}
+            aria-label={`选择${category.name}分类，共${category.count}个模板`}
+          >
+            <div className="category-icon">
+              <i className={category.icon}></i>
+            </div>
+            <div className="category-title">{category.name}</div>
+            <div className="category-count">{category.count}个模板</div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}