428 lines
22 KiB
HTML
428 lines
22 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>中国烟草AI合同及卷宗审核系统 - 评查点列表</title>
|
|
<link href="https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css" rel="stylesheet">
|
|
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
|
|
<!-- 引入外部CSS文件 -->
|
|
<link href="main.css" rel="stylesheet">
|
|
</head>
|
|
<body>
|
|
<div class="layout-container">
|
|
<!-- 侧边栏 -->
|
|
<div class="sidebar">
|
|
<div class="py-6 px-4 border-b border-gray-100">
|
|
<div class="flex items-center">
|
|
<i class="ri-file-search-line text-primary text-xl mr-2"></i>
|
|
<h2 class="text-lg font-medium">AI审核系统</h2>
|
|
</div>
|
|
</div>
|
|
<div class="py-4">
|
|
<div class="sidebar-menu-item">
|
|
<a href="#" class="flex items-center text-sm font-medium">
|
|
<i class="ri-dashboard-line mr-3"></i>
|
|
<span>首页</span>
|
|
</a>
|
|
</div>
|
|
<div class="sidebar-menu-item">
|
|
<a href="#" class="flex items-center text-sm font-medium">
|
|
<i class="ri-file-upload-line mr-3"></i>
|
|
<span>文件上传</span>
|
|
</a>
|
|
</div>
|
|
<div class="sidebar-menu-item active">
|
|
<a href="#" class="flex items-center text-sm font-medium">
|
|
<i class="ri-list-check-2 mr-3"></i>
|
|
<span>评查规则库</span>
|
|
</a>
|
|
</div>
|
|
<div class="sidebar-menu-item">
|
|
<a href="#" class="flex items-center text-sm font-medium">
|
|
<i class="ri-history-line mr-3"></i>
|
|
<span>审核历史</span>
|
|
</a>
|
|
</div>
|
|
<div class="sidebar-menu-item">
|
|
<a href="#" class="flex items-center text-sm font-medium">
|
|
<i class="ri-settings-3-line mr-3"></i>
|
|
<span>系统设置</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 主内容区 -->
|
|
<div class="main-content">
|
|
<!-- 面包屑导航 -->
|
|
<div class="breadcrumb">
|
|
<span class="breadcrumb-item">首页</span>
|
|
<span class="breadcrumb-item">评查规则库</span>
|
|
<span class="breadcrumb-item">合同基本要素检查</span>
|
|
<span class="breadcrumb-item">评查点管理</span>
|
|
</div>
|
|
|
|
<!-- 页面头部 -->
|
|
<div class="flex justify-between items-center mb-4">
|
|
<h2 class="text-xl font-medium">评查点管理</h2>
|
|
<div>
|
|
<a href="新增评查点.html" class="ant-btn ant-btn-primary">
|
|
<i class="ri-add-line"></i> 新增评查点
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 筛选区域 -->
|
|
<div class="ant-card">
|
|
<div class="ant-card-body">
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
|
|
<div>
|
|
<label class="form-label">评查点类型</label>
|
|
<select class="form-select">
|
|
<option value="">全部</option>
|
|
<option value="essential">基本要素类</option>
|
|
<option value="content">内容合规类</option>
|
|
<option value="format">格式规范类</option>
|
|
<option value="legal">法律风险类</option>
|
|
<option value="business">业务专项类</option>
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label class="form-label">所属规则组</label>
|
|
<select class="form-select">
|
|
<option value="">全部</option>
|
|
<option value="contract-base">合同基本要素检查</option>
|
|
<option value="contract-sales">销售合同专项检查</option>
|
|
<option value="contract-purchase">采购合同专项检查</option>
|
|
<option value="license">专卖许可证审核规则</option>
|
|
<option value="punishment">行政处罚规范性检查</option>
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label class="form-label">状态</label>
|
|
<select class="form-select">
|
|
<option value="">全部</option>
|
|
<option value="true">启用</option>
|
|
<option value="false">禁用</option>
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label class="form-label">搜索</label>
|
|
<div class="search-box">
|
|
<input type="text" class="form-input" placeholder="输入评查点名称或编码">
|
|
<button class="ant-btn ant-btn-primary">
|
|
<i class="ri-search-line"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 评查点列表 -->
|
|
<div class="ant-card">
|
|
<div class="ant-card-body">
|
|
<table class="ant-table">
|
|
<thead>
|
|
<tr>
|
|
<th>评查点编码</th>
|
|
<th>评查点名称</th>
|
|
<th>评查点类型</th>
|
|
<th>所属规则组</th>
|
|
<th>优先级</th>
|
|
<th>状态</th>
|
|
<th>创建时间</th>
|
|
<th>操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>CP001</td>
|
|
<td>合同主体信息完整性检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-blue">基本要素类</span>
|
|
</td>
|
|
<td>合同基本要素检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-red">高</span>
|
|
</td>
|
|
<td>
|
|
<span><i class="status-dot status-dot-success"></i>启用</span>
|
|
</td>
|
|
<td>2023-06-15 10:30</td>
|
|
<td class="operations-cell">
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-file-copy-line"></i> 复制
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-danger">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>CP002</td>
|
|
<td>合同金额一致性校验</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-purple">内容合规类</span>
|
|
</td>
|
|
<td>合同基本要素检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-red">高</span>
|
|
</td>
|
|
<td>
|
|
<span><i class="status-dot status-dot-success"></i>启用</span>
|
|
</td>
|
|
<td>2023-06-20 14:15</td>
|
|
<td class="operations-cell">
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-file-copy-line"></i> 复制
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-danger">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>CP003</td>
|
|
<td>保密条款合规性审核</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-cyan">法律风险类</span>
|
|
</td>
|
|
<td>合同基本要素检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-orange">中</span>
|
|
</td>
|
|
<td>
|
|
<span><i class="status-dot status-dot-success"></i>启用</span>
|
|
</td>
|
|
<td>2023-07-05 09:45</td>
|
|
<td class="operations-cell">
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-file-copy-line"></i> 复制
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-danger">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>CP004</td>
|
|
<td>合同签约日期格式检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-green">格式规范类</span>
|
|
</td>
|
|
<td>合同基本要素检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-green">低</span>
|
|
</td>
|
|
<td>
|
|
<span><i class="status-dot status-dot-default"></i>禁用</span>
|
|
</td>
|
|
<td>2023-07-10 16:20</td>
|
|
<td class="operations-cell">
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-file-copy-line"></i> 复制
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-danger">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>CP005</td>
|
|
<td>违约责任条款完整性检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-cyan">法律风险类</span>
|
|
</td>
|
|
<td>销售合同专项检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-red">高</span>
|
|
</td>
|
|
<td>
|
|
<span><i class="status-dot status-dot-success"></i>启用</span>
|
|
</td>
|
|
<td>2023-07-20 11:30</td>
|
|
<td class="operations-cell">
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-file-copy-line"></i> 复制
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-danger">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>CP006</td>
|
|
<td>交货期限有效性检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-orange">业务专项类</span>
|
|
</td>
|
|
<td>销售合同专项检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-orange">中</span>
|
|
</td>
|
|
<td>
|
|
<span><i class="status-dot status-dot-success"></i>启用</span>
|
|
</td>
|
|
<td>2023-08-01 14:40</td>
|
|
<td class="operations-cell">
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-file-copy-line"></i> 复制
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-danger">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>CP007</td>
|
|
<td>合同条款矛盾性检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-cyan">法律风险类</span>
|
|
</td>
|
|
<td>采购合同专项检查</td>
|
|
<td>
|
|
<span class="ant-tag ant-tag-red">高</span>
|
|
</td>
|
|
<td>
|
|
<span><i class="status-dot status-dot-success"></i>启用</span>
|
|
</td>
|
|
<td>2023-08-10 09:15</td>
|
|
<td class="operations-cell">
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-default mr-1">
|
|
<i class="ri-file-copy-line"></i> 复制
|
|
</button>
|
|
<button class="ant-btn ant-btn-sm ant-btn-danger">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<!-- 分页 -->
|
|
<div class="ant-pagination">
|
|
<div class="ant-pagination-prev ant-pagination-disabled">
|
|
<i class="ri-arrow-left-s-line"></i>
|
|
</div>
|
|
<div class="ant-pagination-item ant-pagination-item-active">1</div>
|
|
<div class="ant-pagination-item">2</div>
|
|
<div class="ant-pagination-item">3</div>
|
|
<div class="ant-pagination-next">
|
|
<i class="ri-arrow-right-s-line"></i>
|
|
</div>
|
|
<div class="ant-pagination-options">
|
|
<span class="text-sm mr-2">共 15 条</span>
|
|
<select class="form-select ant-pagination-options-size-changer" style="width: 100px;">
|
|
<option value="10">10 条/页</option>
|
|
<option value="20">20 条/页</option>
|
|
<option value="50">50 条/页</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// 筛选功能
|
|
const filterSelects = document.querySelectorAll('.ant-card:first-of-type .form-select');
|
|
filterSelects.forEach(select => {
|
|
select.addEventListener('change', function() {
|
|
// 这里可以根据选择的值进行筛选,实际应用中可以通过AJAX请求后端接口
|
|
// console.log('筛选条件变更:', select.value);
|
|
});
|
|
});
|
|
|
|
// 搜索功能
|
|
const searchBtn = document.querySelector('.search-box .ant-btn');
|
|
const searchInput = document.querySelector('.search-box .form-input');
|
|
if (searchBtn) {
|
|
searchBtn.addEventListener('click', function() {
|
|
// 这里可以根据输入的关键词进行搜索,实际应用中可以通过AJAX请求后端接口
|
|
// console.log('搜索关键词:', searchInput.value);
|
|
});
|
|
}
|
|
|
|
// 分页功能
|
|
const paginationItems = document.querySelectorAll('.ant-pagination-item');
|
|
paginationItems.forEach(item => {
|
|
item.addEventListener('click', function() {
|
|
// 移除所有页码的active状态
|
|
paginationItems.forEach(el => el.classList.remove('ant-pagination-item-active'));
|
|
// 给当前点击的页码添加active状态
|
|
this.classList.add('ant-pagination-item-active');
|
|
// 这里可以根据页码加载不同页的数据,实际应用中可以通过AJAX请求后端接口
|
|
// console.log('切换到页码:', this.textContent);
|
|
});
|
|
});
|
|
|
|
// 表格行操作按钮事件
|
|
const editBtns = document.querySelectorAll('.operations-cell .ant-btn:first-child');
|
|
const copyBtns = document.querySelectorAll('.operations-cell .ant-btn:nth-child(2)');
|
|
const deleteBtns = document.querySelectorAll('.operations-cell .ant-btn:nth-child(3)');
|
|
|
|
editBtns.forEach((btn, index) => {
|
|
btn.addEventListener('click', function() {
|
|
const row = this.closest('tr');
|
|
const id = row.children[0].textContent;
|
|
// 编辑操作,可以跳转到编辑页面或打开编辑模态框
|
|
// console.log('编辑评查点:', id);
|
|
window.location.href = `新增评查点.html?id=${id}&mode=edit`;
|
|
});
|
|
});
|
|
|
|
copyBtns.forEach((btn, index) => {
|
|
btn.addEventListener('click', function() {
|
|
const row = this.closest('tr');
|
|
const id = row.children[0].textContent;
|
|
const name = row.children[1].textContent;
|
|
// 复制操作
|
|
// console.log('复制评查点:', id, name);
|
|
// 在实际应用中,这里可以弹出确认对话框,然后进行复制操作
|
|
alert(`确认复制评查点: ${name}?`);
|
|
});
|
|
});
|
|
|
|
deleteBtns.forEach((btn, index) => {
|
|
btn.addEventListener('click', function() {
|
|
const row = this.closest('tr');
|
|
const id = row.children[0].textContent;
|
|
const name = row.children[1].textContent;
|
|
// 删除操作
|
|
// console.log('删除评查点:', id, name);
|
|
// 在实际应用中,这里可以弹出确认对话框,然后进行删除操作
|
|
if (confirm(`确认删除评查点: ${name}?`)) {
|
|
// 执行删除操作,实际应用中可以通过AJAX请求后端接口
|
|
row.remove();
|
|
}
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |