去除无用功能,暂时注释
This commit is contained in:
@@ -177,7 +177,7 @@ export async function getContractTemplates(searchParams: TemplateSearchParams =
|
||||
|
||||
// 构建查询参数
|
||||
const params: PostgrestParams = {
|
||||
select: 'id,template_code,title,category_id,description,file_path,file_format,is_featured,created_at,updated_at,pdf_file_path,contract_categories(id,name,icon,description)',
|
||||
select: 'id,template_code,title,category_id,description,file_path,file_format,is_featured,created_at,updated_at,pdf_file_path,category:contract_categories(id,name,icon,description)',
|
||||
limit: pageSize,
|
||||
offset: (page - 1) * pageSize,
|
||||
order: `${sortBy}.${sortOrder}`
|
||||
@@ -271,7 +271,7 @@ export async function getContractTemplates(searchParams: TemplateSearchParams =
|
||||
export async function getContractTemplate(id: string | number) {
|
||||
try {
|
||||
const params: PostgrestParams = {
|
||||
select: 'id,template_code,title,category_id,description,file_path,file_format,is_featured,created_at,updated_at,pdf_file_path,contract_categories(id,name,icon,description)',
|
||||
select: 'id,template_code,title,category_id,description,file_path,file_format,is_featured,created_at,updated_at,pdf_file_path,category:contract_categories(id,name,icon,description)',
|
||||
filter: { 'id': `eq.${id}` }
|
||||
};
|
||||
|
||||
@@ -303,7 +303,7 @@ export async function getContractTemplate(id: string | number) {
|
||||
export async function getFeaturedTemplates(limit: number = 6) {
|
||||
try {
|
||||
const params: PostgrestParams = {
|
||||
select: 'id,template_code,title,category_id,description,file_path,file_format,is_featured,created_at,updated_at,pdf_file_path,contract_categories(id,name,icon,description)',
|
||||
select: 'id,template_code,title,category_id,description,file_path,file_format,is_featured,created_at,updated_at,pdf_file_path,category:contract_categories(id,name,icon,description)',
|
||||
filter: { 'is_featured': 'eq.true' },
|
||||
order: 'updated_at.desc',
|
||||
limit
|
||||
|
||||
@@ -72,11 +72,6 @@ export function TemplateCard({ template, onClick }: TemplateCardProps) {
|
||||
|
||||
switch (action) {
|
||||
case '立即下载':
|
||||
// 添加调试信息
|
||||
console.log('模板数据:', template);
|
||||
console.log('文件路径:', template.file_path);
|
||||
console.log('文件格式:', template.file_format);
|
||||
|
||||
if (template.file_path) {
|
||||
// 构建文件名,使用模板标题和文件格式
|
||||
const fileExtension = template.file_format || 'docx';
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import type { MetaFunction, LoaderFunctionArgs } from '@remix-run/node';
|
||||
import { useLoaderData, useNavigate } from '@remix-run/react';
|
||||
import { useState } from 'react';
|
||||
import { getContractTemplate } from '~/api/contract-template/templates';
|
||||
import type { ContractTemplate } from '~/api/contract-template/templates';
|
||||
import styles from '~/styles/pages/contract-template.css?url';
|
||||
|
||||
// 导入FilePreview组件
|
||||
@@ -112,123 +113,108 @@ export const handle = {
|
||||
}
|
||||
};
|
||||
|
||||
// 模拟详细数据
|
||||
const getTemplateDetail = (id: string) => {
|
||||
const templates = {
|
||||
'1': {
|
||||
id: '1',
|
||||
title: '烟草产品销售合同(2023版)',
|
||||
type: '销售合同 · 标准版',
|
||||
description: '本模板是专为烟草行业设计的标准销售合同,严格遵循《烟草专卖法》等相关法律法规,涵盖了烟草产品销售过程中的各个关键环节。',
|
||||
updateTime: '2023年10月25日',
|
||||
useCount: 2156,
|
||||
rating: 4.9,
|
||||
fileSize: '245KB',
|
||||
scope: '烟草产品销售',
|
||||
legalBasis: '《合同法》《烟草专卖法》',
|
||||
templateCode: 'XS-2023-001',
|
||||
reviews: [
|
||||
{
|
||||
user: '李经理',
|
||||
rating: 5,
|
||||
comment: '模板非常专业,条款完整,符合行业规范。我们公司一直在使用这个模板,效果很好。',
|
||||
date: '2023-10-20'
|
||||
},
|
||||
{
|
||||
user: '王总',
|
||||
rating: 4,
|
||||
comment: '模板结构清晰,易于理解和使用。特别是违约责任条款写得很详细,对我们很有帮助。',
|
||||
date: '2023-10-18'
|
||||
}
|
||||
],
|
||||
features: [
|
||||
{ title: '法律合规', description: '严格遵循烟草行业法律法规,确保合同条款合法有效', icon: 'ri-shield-check-line', color: 'green' },
|
||||
{ title: '条款完整', description: '涵盖销售全流程,条款结构完整,逻辑清晰', icon: 'ri-settings-3-line', color: 'blue' },
|
||||
{ title: '易于定制', description: '模板化设计,可根据具体业务需求灵活调整', icon: 'ri-edit-line', color: 'purple' },
|
||||
{ title: '行业标准', description: '符合烟草行业标准,被广泛使用和认可', icon: 'ri-award-line', color: 'orange' }
|
||||
],
|
||||
structure: [
|
||||
{ step: 1, title: '合同主体', description: '甲乙双方基本信息、资质证明' },
|
||||
{ step: 2, title: '标的物条款', description: '产品名称、规格、数量、质量标准' },
|
||||
{ step: 3, title: '价格与付款', description: '价格条款、付款方式、结算周期' },
|
||||
{ step: 4, title: '交付与验收', description: '交付时间、地点、方式、验收标准' },
|
||||
{ step: 5, title: '违约责任', description: '违约情形、责任承担、损失赔偿' },
|
||||
{ step: 6, title: '争议解决', description: '争议处理方式、管辖法院' }
|
||||
],
|
||||
preview: `
|
||||
中文合同预览内容...
|
||||
|
||||
烟草产品销售合同
|
||||
合同编号:_______________
|
||||
|
||||
甲方(销售方):_________________________
|
||||
地址:_____________________________________
|
||||
法定代表人:_______________ 联系电话:_______________
|
||||
烟草专卖许可证号:_________________________
|
||||
|
||||
乙方(采购方):_________________________
|
||||
地址:_____________________________________
|
||||
法定代表人:_______________ 联系电话:_______________
|
||||
烟草专卖零售许可证号:_____________________
|
||||
|
||||
根据《中华人民共和国合同法》、《中华人民共和国烟草专卖法》等相关法律法规,
|
||||
甲乙双方在平等、自愿、公平、诚信的基础上,就烟草产品销售事宜达成如下协议:
|
||||
|
||||
第一条 标的物
|
||||
1.1 产品名称:_________________________
|
||||
1.2 产品规格:_________________________
|
||||
1.3 产品数量:_________________________
|
||||
1.4 产品单价:_________________________
|
||||
1.5 合同总金额:_______________________
|
||||
|
||||
... 更多条款内容请下载完整模板查看 ...
|
||||
`
|
||||
}
|
||||
};
|
||||
|
||||
return templates[id as keyof typeof templates] || null;
|
||||
};
|
||||
|
||||
export async function loader({ params }: LoaderFunctionArgs) {
|
||||
const template = getTemplateDetail(params.id!);
|
||||
const templateId = params.id!;
|
||||
|
||||
if (!template) {
|
||||
try {
|
||||
const response = await getContractTemplate(templateId);
|
||||
|
||||
if (response.error) {
|
||||
throw new Response(response.error, { status: response.status || 404 });
|
||||
}
|
||||
|
||||
if (!response.data) {
|
||||
throw new Response('模板未找到', { status: 404 });
|
||||
}
|
||||
|
||||
return { template };
|
||||
// 添加调试信息
|
||||
console.log('模板详情数据:', response.data);
|
||||
console.log('分类信息:', response.data.category);
|
||||
|
||||
return { template: response.data };
|
||||
} catch (error) {
|
||||
console.error('加载模板详情失败:', error);
|
||||
throw new Response('模板未找到', { status: 404 });
|
||||
}
|
||||
}
|
||||
|
||||
export default function ContractTemplateDetail() {
|
||||
const { template } = useLoaderData<typeof loader>();
|
||||
const { template }: { template: ContractTemplate } = useLoaderData<typeof loader>();
|
||||
const navigate = useNavigate();
|
||||
const [isFavorited, setIsFavorited] = useState(false);
|
||||
// 注释掉收藏功能
|
||||
// const [isFavorited, setIsFavorited] = useState(false);
|
||||
|
||||
const handleBack = () => {
|
||||
navigate(-1);
|
||||
};
|
||||
|
||||
// MinIO下载URL构建函数
|
||||
const buildDownloadUrl = (filePath: string): string => {
|
||||
const minioHost = 'http://nas.7bm.co:9000';
|
||||
const bucketName = 'docauditai';
|
||||
|
||||
const cleanPath = filePath.startsWith('/') ? filePath.substring(1) : filePath;
|
||||
return `${minioHost}/${bucketName}/${cleanPath}`;
|
||||
};
|
||||
|
||||
// 下载文件函数
|
||||
const downloadFile = async (filePath: string, fileName: string) => {
|
||||
try {
|
||||
const downloadUrl = buildDownloadUrl(filePath);
|
||||
|
||||
const cleanFileName = fileName.replace(/[<>:"/\\|?*]/g, '_');
|
||||
|
||||
const link = document.createElement('a');
|
||||
link.href = downloadUrl;
|
||||
link.download = cleanFileName;
|
||||
link.target = '_blank';
|
||||
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
|
||||
console.log('开始下载文件:', cleanFileName);
|
||||
} catch (error) {
|
||||
console.error('下载文件失败:', error);
|
||||
alert('下载失败,请稍后重试');
|
||||
}
|
||||
};
|
||||
|
||||
const handleDownload = () => {
|
||||
console.log('下载模板:', template.id);
|
||||
// 这里应该是实际的下载逻辑
|
||||
if (template.file_path) {
|
||||
const fileExtension = template.file_format || 'docx';
|
||||
const fileName = `${template.title}.${fileExtension}`;
|
||||
downloadFile(template.file_path, fileName);
|
||||
} else {
|
||||
alert('文件路径不存在,无法下载');
|
||||
}
|
||||
};
|
||||
|
||||
const handlePreview = () => {
|
||||
console.log('预览模板:', template.id);
|
||||
// 这里应该打开预览模态框或新页面
|
||||
// 页面内预览,滚动到预览区域
|
||||
const previewElement = document.getElementById('template-preview');
|
||||
if (previewElement) {
|
||||
previewElement.scrollIntoView({ behavior: 'smooth' });
|
||||
}
|
||||
};
|
||||
|
||||
const handleFavorite = () => {
|
||||
/* const handleFavorite = () => {
|
||||
setIsFavorited(!isFavorited);
|
||||
console.log('收藏状态:', !isFavorited);
|
||||
};
|
||||
}; */
|
||||
|
||||
const handleShare = () => {
|
||||
console.log('分享模板:', template.id);
|
||||
// 这里应该是分享功能
|
||||
};
|
||||
/* const handleShare = () => {
|
||||
// 复制当前页面URL到剪贴板
|
||||
navigator.clipboard.writeText(window.location.href).then(() => {
|
||||
alert('链接已复制到剪贴板');
|
||||
}).catch(() => {
|
||||
alert('复制失败,请手动复制链接');
|
||||
});
|
||||
}; */
|
||||
|
||||
const renderStars = (rating: number) => {
|
||||
// 注释掉评分相关功能
|
||||
/* const renderStars = (rating: number) => {
|
||||
const stars = [];
|
||||
const fullStars = Math.floor(rating);
|
||||
|
||||
@@ -240,14 +226,14 @@ export default function ContractTemplateDetail() {
|
||||
}
|
||||
}
|
||||
return stars;
|
||||
};
|
||||
}; */
|
||||
|
||||
// 创建文件内容对象用于FilePreview组件
|
||||
const fileContent = {
|
||||
const fileContent = template.pdf_file_path ? {
|
||||
title: template.title,
|
||||
contractNumber: template.templateCode,
|
||||
// 设置PDF路径,FilePreview会自动拼接基础URL
|
||||
path: 'contract-template/买卖合同/买卖合同范本.pdf',
|
||||
contractNumber: template.template_code,
|
||||
// 使用pdf_file_path字段
|
||||
path: template.pdf_file_path,
|
||||
parties: {
|
||||
partyA: {
|
||||
name: '',
|
||||
@@ -263,7 +249,7 @@ export default function ContractTemplateDetail() {
|
||||
}
|
||||
},
|
||||
sections: []
|
||||
};
|
||||
} : null;
|
||||
|
||||
return (
|
||||
<div className="contract-search-results">
|
||||
@@ -282,7 +268,8 @@ export default function ContractTemplateDetail() {
|
||||
<div className="template-detail max-w-4xl mx-auto">
|
||||
{/* 详情头部 */}
|
||||
<div className="detail-header bg-white rounded-xl p-8 mb-6 border border-gray-100">
|
||||
<div className="flex justify-between items-start mb-4">
|
||||
{/* 注释掉类型和评分显示 */}
|
||||
{/* <div className="flex justify-between items-start mb-4">
|
||||
<div className="template-type">{template.type}</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="flex items-center gap-1 text-yellow-500">
|
||||
@@ -290,20 +277,35 @@ export default function ContractTemplateDetail() {
|
||||
<span className="text-sm ml-1">{template.rating} (156评价)</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
<h1 className="detail-title text-3xl font-semibold mb-6">{template.title}</h1>
|
||||
|
||||
<div className="detail-meta grid grid-cols-2 md:grid-cols-3 gap-4 mb-6">
|
||||
<div className="meta-item">
|
||||
<span className="meta-label text-gray-500">模板编号:</span>
|
||||
<span>{template.templateCode}</span>
|
||||
<span>{template.template_code}</span>
|
||||
</div>
|
||||
<div className="meta-item">
|
||||
<span className="meta-label text-gray-500">更新时间:</span>
|
||||
<span>{template.updateTime}</span>
|
||||
<span>{new Date(template.updated_at).toLocaleDateString('zh-CN')}</span>
|
||||
</div>
|
||||
<div className="meta-item">
|
||||
<span className="meta-label text-gray-500">所属分类:</span>
|
||||
<span>{template.category?.name || '其他'}</span>
|
||||
</div>
|
||||
<div className="meta-item">
|
||||
<span className="meta-label text-gray-500">文件格式:</span>
|
||||
<span>{template.file_format?.toUpperCase()}</span>
|
||||
</div>
|
||||
{template.is_featured && (
|
||||
<div className="meta-item">
|
||||
<span className="meta-label text-gray-500">特色推荐:</span>
|
||||
<span className="text-primary">是</span>
|
||||
</div>
|
||||
)}
|
||||
{/* 注释掉使用次数、文件大小、适用范围、法律依据等字段 */}
|
||||
{/* <div className="meta-item">
|
||||
<span className="meta-label text-gray-500">使用次数:</span>
|
||||
<span>{template.useCount.toLocaleString()}次</span>
|
||||
</div>
|
||||
@@ -318,7 +320,7 @@ export default function ContractTemplateDetail() {
|
||||
<div className="meta-item">
|
||||
<span className="meta-label text-gray-500">法律依据:</span>
|
||||
<span>{template.legalBasis}</span>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
|
||||
<div className="detail-actions flex gap-3">
|
||||
@@ -329,6 +331,7 @@ export default function ContractTemplateDetail() {
|
||||
<i className="ri-download-line"></i>
|
||||
立即下载使用
|
||||
</button>
|
||||
{template.pdf_file_path && (
|
||||
<button
|
||||
className="detail-btn secondary bg-white border border-gray-200 px-6 py-3 rounded-lg flex items-center gap-2 hover:border-primary"
|
||||
onClick={handlePreview}
|
||||
@@ -336,20 +339,22 @@ export default function ContractTemplateDetail() {
|
||||
<i className="ri-eye-line"></i>
|
||||
在线预览
|
||||
</button>
|
||||
<button
|
||||
)}
|
||||
{/* 注释掉收藏功能 */}
|
||||
{/* <button
|
||||
className={`detail-btn secondary bg-white border border-gray-200 px-6 py-3 rounded-lg flex items-center gap-2 hover:border-primary ${isFavorited ? 'text-yellow-500' : ''}`}
|
||||
onClick={handleFavorite}
|
||||
>
|
||||
<i className={isFavorited ? 'ri-star-fill' : 'ri-star-line'}></i>
|
||||
收藏模板
|
||||
</button>
|
||||
<button
|
||||
</button> */}
|
||||
{/* <button
|
||||
className="detail-btn secondary bg-white border border-gray-200 px-6 py-3 rounded-lg flex items-center gap-2 hover:border-primary"
|
||||
onClick={handleShare}
|
||||
>
|
||||
<i className="ri-share-line"></i>
|
||||
分享
|
||||
</button>
|
||||
</button> */}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -359,14 +364,18 @@ export default function ContractTemplateDetail() {
|
||||
<div className="content-section mb-8">
|
||||
<h3 className="section-title text-xl font-semibold mb-4">模板简介</h3>
|
||||
<p className="text-gray-600 leading-relaxed">
|
||||
{template.description}模板包含完整的合同条款结构,
|
||||
包括合同主体、标的物、价格条款、交付方式、付款条件、违约责任、争议解决等核心内容。
|
||||
适用于各类烟草产品的销售业务,能够有效保护交易双方的合法权益。
|
||||
{template.description || '该合同模板为标准格式,包含完整的合同条款结构,适用于相关业务场景的合同签署。'}
|
||||
{template.category?.description && (
|
||||
<>
|
||||
<br /><br />
|
||||
<strong>适用范围:</strong>{template.category.description}
|
||||
</>
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* 主要特点 */}
|
||||
<div className="content-section mb-8">
|
||||
{/* 注释掉主要特点模块 */}
|
||||
{/* <div className="content-section mb-8">
|
||||
<h3 className="section-title text-xl font-semibold mb-4">主要特点</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
{template.features.map((feature, index) => (
|
||||
@@ -379,10 +388,10 @@ export default function ContractTemplateDetail() {
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
{/* 合同条款结构 */}
|
||||
<div className="content-section mb-8">
|
||||
{/* 注释掉合同条款结构模块 */}
|
||||
{/* <div className="content-section mb-8">
|
||||
<h3 className="section-title text-xl font-semibold mb-4">合同条款结构</h3>
|
||||
<div className="space-y-3">
|
||||
{template.structure.map((item) => (
|
||||
@@ -397,10 +406,11 @@ export default function ContractTemplateDetail() {
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
{/* 合同预览 */}
|
||||
<div className="content-section mb-8">
|
||||
{/* 合同预览 - 只有当存在pdf_file_path时才显示 */}
|
||||
{fileContent && (
|
||||
<div className="content-section mb-8" id="template-preview">
|
||||
<h3 className="section-title text-xl font-semibold mb-4">合同预览</h3>
|
||||
<div className="border border-gray-200 rounded-lg overflow-hidden">
|
||||
{/* 使用更强的样式隔离 */}
|
||||
@@ -439,9 +449,10 @@ export default function ContractTemplateDetail() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* 用户评价 */}
|
||||
<div className="content-section">
|
||||
{/* 注释掉用户评价模块 */}
|
||||
{/* <div className="content-section">
|
||||
<h3 className="section-title text-xl font-semibold mb-4">用户评价</h3>
|
||||
<div className="space-y-4">
|
||||
{template.reviews.map((review, index) => (
|
||||
@@ -462,7 +473,7 @@ export default function ContractTemplateDetail() {
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -24,25 +24,6 @@ export const meta: MetaFunction = () => {
|
||||
|
||||
// 将数据库模板转换为前端显示格式
|
||||
function transformTemplate(template: ContractTemplate) {
|
||||
// 模拟使用次数和评分(实际项目中可以从其他表获取)
|
||||
/* const mockUsageCount = Math.floor(Math.random() * 2000) + 100;
|
||||
const mockRating = (Math.random() * 1.5 + 3.5).toFixed(1);
|
||||
|
||||
// 根据模板属性确定类型
|
||||
let templateType = '标准版';
|
||||
if (template.is_featured) {
|
||||
templateType = '推荐版';
|
||||
} else if (template.description && template.description.includes('简化')) {
|
||||
templateType = '简化版';
|
||||
} else if (template.description && (template.description.includes('专业') || template.description.includes('大客户'))) {
|
||||
templateType = '专业版';
|
||||
} */
|
||||
|
||||
// 添加调试信息
|
||||
console.log('原始模板数据:', template);
|
||||
console.log('file_path:', template.file_path);
|
||||
console.log('file_format:', template.file_format);
|
||||
|
||||
return {
|
||||
id: template.id.toString(),
|
||||
title: template.title,
|
||||
|
||||
Reference in New Issue
Block a user