363 lines
19 KiB
HTML
363 lines
19 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://cdnjs.cloudflare.com/ajax/libs/remixicon/2.5.0/remixicon.css" rel="stylesheet">
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css" rel="stylesheet">
|
|
<!-- <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">
|
|
<style>
|
|
.type-badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
padding: 2px 8px;
|
|
border-radius: 12px;
|
|
font-size: 12px;
|
|
background-color: rgba(0, 104, 74, 0.1);
|
|
color: var(--primary-color);
|
|
margin-right: 4px;
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
.groups-container {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 4px;
|
|
max-width: 400px;
|
|
}
|
|
</style>
|
|
</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>
|
|
</div>
|
|
|
|
<!-- 页面头部 -->
|
|
<div class="flex justify-between items-center mb-4">
|
|
<h2 class="text-xl font-medium">文档类型管理</h2>
|
|
<div>
|
|
<button class="ant-btn ant-btn-primary" onclick="window.location.href='文档类型新增修改页面.html'">
|
|
<i class="ri-add-line"></i> 新增文档类型
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 搜索栏 -->
|
|
<div class="ant-card mb-4">
|
|
<div class="ant-card-body">
|
|
<div class="flex flex-wrap items-end gap-4">
|
|
<div class="flex-1 min-w-[200px]">
|
|
<label class="form-label">类型名称</label>
|
|
<input type="text" class="form-input" placeholder="请输入文档类型名称">
|
|
</div>
|
|
<div class="flex-1 min-w-[200px]">
|
|
<label class="form-label">关联分组</label>
|
|
<select class="form-select">
|
|
<option value="">全部</option>
|
|
<option value="1">合同基本要素检查</option>
|
|
<option value="4">销售合同专项检查</option>
|
|
<option value="5">行政处罚规范性检查</option>
|
|
</select>
|
|
</div>
|
|
<div class="flex items-center">
|
|
<button class="ant-btn ant-btn-default mr-2">
|
|
<i class="ri-refresh-line"></i> 重置
|
|
</button>
|
|
<button class="ant-btn ant-btn-primary">
|
|
<i class="ri-search-line"></i> 搜索
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 数据表格 -->
|
|
<div class="ant-card">
|
|
<div class="ant-card-body">
|
|
<div class="overflow-x-auto">
|
|
<table class="ant-table">
|
|
<thead>
|
|
<tr>
|
|
<th style="width: 200px;">文档类型名称</th>
|
|
<th style="width: 300px;">描述</th>
|
|
<th>关联的评查点分组</th>
|
|
<th>创建时间</th>
|
|
<th>更新时间</th>
|
|
<th style="width: 150px;">操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>
|
|
<div class="flex items-center">
|
|
<i class="ri-file-text-line text-primary mr-2"></i>
|
|
<span>销售合同</span>
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="text-secondary text-sm truncate max-w-xs" title="烟草产品销售相关的合同文档">
|
|
烟草产品销售相关的合同文档
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="groups-container">
|
|
<span class="type-badge">合同基本要素检查</span>
|
|
<span class="type-badge">销售合同专项检查</span>
|
|
</div>
|
|
</td>
|
|
<td>2023-10-01 14:30</td>
|
|
<td>2023-10-15 09:45</td>
|
|
<td>
|
|
<button class="ant-btn ant-btn-text ant-btn-sm text-primary">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-text ant-btn-sm text-error delete-btn" data-id="1">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td>
|
|
<div class="flex items-center">
|
|
<i class="ri-file-text-line text-primary mr-2"></i>
|
|
<span>采购合同</span>
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="text-secondary text-sm truncate max-w-xs" title="烟草企业采购设备及原材料相关的合同文档">
|
|
烟草企业采购设备及原材料相关的合同文档
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="groups-container">
|
|
<span class="type-badge">合同基本要素检查</span>
|
|
</div>
|
|
</td>
|
|
<td>2023-10-02 11:20</td>
|
|
<td>2023-10-02 11:20</td>
|
|
<td>
|
|
<button class="ant-btn ant-btn-text ant-btn-sm text-primary">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-text ant-btn-sm text-error delete-btn" data-id="2">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td>
|
|
<div class="flex items-center">
|
|
<i class="ri-file-text-line text-primary mr-2"></i>
|
|
<span>专卖许可证</span>
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="text-secondary text-sm truncate max-w-xs" title="烟草专卖许可相关的证件文档">
|
|
烟草专卖许可相关的证件文档
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="groups-container">
|
|
<span class="type-badge">专卖许可证审核规则</span>
|
|
</div>
|
|
</td>
|
|
<td>2023-10-03 09:15</td>
|
|
<td>2023-10-10 14:30</td>
|
|
<td>
|
|
<button class="ant-btn ant-btn-text ant-btn-sm text-primary">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-text ant-btn-sm text-error delete-btn" data-id="3">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td>
|
|
<div class="flex items-center">
|
|
<i class="ri-file-text-line text-primary mr-2"></i>
|
|
<span>行政处罚决定书</span>
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="text-secondary text-sm truncate max-w-xs" title="烟草行业行政处罚相关文书">
|
|
烟草行业行政处罚相关文书
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="groups-container">
|
|
<span class="type-badge">行政处罚规范性检查</span>
|
|
</div>
|
|
</td>
|
|
<td>2023-10-05 16:40</td>
|
|
<td>2023-10-05 16:40</td>
|
|
<td>
|
|
<button class="ant-btn ant-btn-text ant-btn-sm text-primary">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-text ant-btn-sm text-error delete-btn" data-id="4">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td>
|
|
<div class="flex items-center">
|
|
<i class="ri-file-text-line text-primary mr-2"></i>
|
|
<span>承包协议</span>
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="text-secondary text-sm truncate max-w-xs" title="烟草种植承包相关协议文档">
|
|
烟草种植承包相关协议文档
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<div class="groups-container">
|
|
<span class="type-badge">合同基本要素检查</span>
|
|
<span class="type-badge">承包协议专项检查</span>
|
|
</div>
|
|
</td>
|
|
<td>2023-10-08 10:30</td>
|
|
<td>2023-10-12 15:20</td>
|
|
<td>
|
|
<button class="ant-btn ant-btn-text ant-btn-sm text-primary">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button class="ant-btn ant-btn-text ant-btn-sm text-error delete-btn" data-id="5">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<!-- 分页 -->
|
|
<div class="flex justify-between items-center mt-4">
|
|
<div class="text-sm text-secondary">
|
|
共 5 条记录，每页显示 10 条
|
|
</div>
|
|
<div class="ant-pagination">
|
|
<button class="ant-pagination-item ant-pagination-prev" disabled>
|
|
<i class="ri-arrow-left-s-line"></i>
|
|
</button>
|
|
<button class="ant-pagination-item ant-pagination-item-active">1</button>
|
|
<button class="ant-pagination-item ant-pagination-next" disabled>
|
|
<i class="ri-arrow-right-s-line"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// 删除按钮确认对话框
|
|
document.querySelectorAll('.delete-btn').forEach(btn => {
|
|
btn.addEventListener('click', function(e) {
|
|
const typeId = this.getAttribute('data-id');
|
|
if (!confirm('确定要删除该文档类型吗？此操作不会影响关联的评查点分组，但可能会影响使用该类型的文档评查。')) {
|
|
e.preventDefault();
|
|
} else {
|
|
console.log('删除文档类型ID:', typeId);
|
|
// 实际应调用API删除数据
|
|
alert('删除成功！');
|
|
// 刷新页面
|
|
window.location.reload();
|
|
}
|
|
});
|
|
});
|
|
|
|
// 搜索功能
|
|
const searchBtn = document.querySelector('.ant-btn-primary');
|
|
searchBtn.addEventListener('click', function() {
|
|
const nameInput = document.querySelector('.form-input').value;
|
|
const groupSelect = document.querySelector('.form-select').value;
|
|
|
|
console.log('搜索条件：', {
|
|
name: nameInput,
|
|
groupId: groupSelect
|
|
});
|
|
|
|
// 实际应用中应该通过AJAX请求获取过滤后的数据
|
|
alert('执行搜索操作');
|
|
});
|
|
|
|
// 重置按钮
|
|
const resetBtn = document.querySelector('.ant-btn-default');
|
|
resetBtn.addEventListener('click', function() {
|
|
document.querySelector('.form-input').value = '';
|
|
document.querySelector('.form-select').value = '';
|
|
});
|
|
|
|
// 编辑按钮点击事件
|
|
document.querySelectorAll('.text-primary').forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const row = this.closest('tr');
|
|
const typeName = row.querySelector('td:first-child span').textContent;
|
|
window.location.href = `文档类型-新增.html?id=${this.closest('button').getAttribute('data-id') || ''}&name=${encodeURIComponent(typeName)}`;
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |