TrustDataSpace/pages/data-market.html
sichan 71a472969a 更新记录
1. 修改了数据运营服务页面
2. 新增了数据钱包页面(整体的和企业的,两个版本)
3. 新增了接口化配置可信数据空间的页面设计
2025-01-20 01:04:17 +08:00

240 lines
12 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>数据市场 - 可信数据空间</title>
<link href="../vendor/bootstrap/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
<link href="../assets/css/styles.css" rel="stylesheet">
</head>
<body class="d-flex flex-column min-vh-100">
<!-- Header -->
<div id="header"></div>
<!-- 主要内容区域 -->
<div class="container my-5 flex-grow-1">
<!-- 搜索栏 -->
<div class="row mb-4">
<div class="col-md-8 mx-auto">
<div class="input-group">
<input type="text" class="form-control" placeholder="搜索数据产品...">
<button class="btn btn-primary" type="button">
<i class="bi bi-search"></i> 搜索
</button>
</div>
</div>
</div>
<!-- 分类筛选 -->
<div class="row mb-4">
<div class="col-12">
<div class="card">
<div class="card-body">
<div class="mb-3">
<strong class="me-2">数据分级:</strong>
<a href="#" class="btn btn-sm btn-outline-danger me-2">一级敏感</a>
<a href="#" class="btn btn-sm btn-outline-warning me-2">二级敏感</a>
<a href="#" class="btn btn-sm btn-outline-info me-2">三级敏感</a>
<a href="#" class="btn btn-sm btn-outline-success">普通</a>
</div>
<div class="mb-3">
<strong class="me-2">行业分类:</strong>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">金融</a>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">医疗</a>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">制造</a>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">零售</a>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">教育</a>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">交通</a>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">能源</a>
<a href="#" class="btn btn-sm btn-outline-secondary">更多</a>
</div>
<div>
<strong class="me-2">数据类型:</strong>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">结构化数据</a>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">非结构化数据</a>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">实时数据流</a>
<a href="#" class="btn btn-sm btn-outline-secondary">API接口</a>
</div>
<div class="mt-3">
<strong class="me-2">更新频率:</strong>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">实时</a>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">每日</a>
<a href="#" class="btn btn-sm btn-outline-secondary me-2">每周</a>
<a href="#" class="btn btn-sm btn-outline-secondary">每月</a>
</div>
</div>
</div>
</div>
</div>
<!-- 数据产品列表 -->
<div class="row g-4">
<!-- 数据产品卡片 1 -->
<div class="col-md-4">
<div class="card h-100">
<div class="card-body">
<span class="badge bg-primary mb-2">金融数据</span>
<h5 class="card-title">企业信用评分数据包</h5>
<p class="card-text text-muted">包含100万+企业的多维度信用评分数据,适用于风控建模</p>
<div class="mb-3">
<small class="text-muted">
<i class="bi bi-clock"></i> 更新频率: 每日
</small>
</div>
<div class="d-flex justify-content-between align-items-center">
<div class="text-primary fw-bold">
<i class="bi bi-coin"></i>
<span>¥2000/月</span>
</div>
<button class="btn btn-outline-primary btn-sm">
<i class="bi bi-cart-plus"></i> 购买授权
</button>
</div>
</div>
</div>
</div>
<!-- 数据产品卡片 2 -->
<div class="col-md-4">
<div class="card h-100">
<div class="card-body">
<span class="badge bg-success mb-2">医疗数据</span>
<h5 class="card-title">医疗器械使用数据API</h5>
<p class="card-text text-muted">覆盖全国3000+医院的医疗器械使用情况实时数据接口</p>
<div class="mb-3">
<small class="text-muted">
<i class="bi bi-clock"></i> 更新频率: 实时
</small>
</div>
<div class="d-flex justify-content-between align-items-center">
<div class="text-primary fw-bold">
<i class="bi bi-coin"></i>
<span>¥5000/月</span>
</div>
<button class="btn btn-outline-primary btn-sm">
<i class="bi bi-cart-plus"></i> 购买授权
</button>
</div>
</div>
</div>
</div>
<!-- 数据产品卡片 3 -->
<div class="col-md-4">
<div class="card h-100">
<div class="card-body">
<span class="badge bg-warning mb-2">制造业数据</span>
<h5 class="card-title">工业设备运行状态数据</h5>
<p class="card-text text-muted">涵盖主要工业设备的运行参数、维护记录等数据集</p>
<div class="mb-3">
<small class="text-muted">
<i class="bi bi-clock"></i> 更新频率: 每小时
</small>
</div>
<div class="d-flex justify-content-between align-items-center">
<div class="text-primary fw-bold">
<i class="bi bi-coin"></i>
<span>¥3000/月</span>
</div>
<button class="btn btn-outline-primary btn-sm">
<i class="bi bi-cart-plus"></i> 购买授权
</button>
</div>
</div>
</div>
</div>
<!-- 新增数据产品卡片 -->
<div class="col-md-4">
<div class="card h-100">
<div class="card-body">
<div class="d-flex justify-content-between mb-2">
<span class="badge bg-danger">一级敏感</span>
<span class="badge bg-info">医疗数据</span>
</div>
<h5 class="card-title">医疗影像诊断数据集</h5>
<p class="card-text text-muted">包含50万+标注医疗影像数据适用于AI模型训练</p>
<div class="mb-3">
<small class="text-muted me-3">
<i class="bi bi-clock"></i> 每日更新
</small>
<small class="text-muted">
<i class="bi bi-database"></i> 15TB
</small>
</div>
<div class="d-flex justify-content-between align-items-center">
<div class="text-primary fw-bold">
<i class="bi bi-coin"></i>
<span>¥8000/月</span>
</div>
<button class="btn btn-outline-primary btn-sm">
<i class="bi bi-cart-plus"></i> 购买授权
</button>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card h-100">
<div class="card-body">
<div class="d-flex justify-content-between mb-2">
<span class="badge bg-warning">二级敏感</span>
<span class="badge bg-primary">交通数据</span>
</div>
<h5 class="card-title">城市交通流量实时数据</h5>
<p class="card-text text-muted">覆盖主要城市路段的实时交通流量、拥堵指数等数据</p>
<div class="mb-3">
<small class="text-muted me-3">
<i class="bi bi-clock"></i> 实时更新
</small>
<small class="text-muted">
<i class="bi bi-database"></i> 500GB/天
</small>
</div>
<div class="d-flex justify-content-between align-items-center">
<div class="text-primary fw-bold">
<i class="bi bi-coin"></i>
<span>¥6000/月</span>
</div>
<button class="btn btn-outline-primary btn-sm">
<i class="bi bi-cart-plus"></i> 购买授权
</button>
</div>
</div>
</div>
</div>
<!-- 更多数据产品卡片 -->
<!-- ... -->
</div>
<!-- 分页 -->
<div class="row mt-4">
<div class="col-12">
<nav aria-label="Page navigation">
<ul class="pagination justify-content-center">
<li class="page-item disabled">
<a class="page-link" href="#" tabindex="-1">上一页</a>
</li>
<li class="page-item active"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item">
<a class="page-link" href="#">下一页</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<!-- Footer -->
<div id="footer"></div>
<script src="../vendor/bootstrap/bootstrap.bundle.min.js"></script>
<script src="../assets/js/components.js"></script>
<script src="../assets/js/script.js"></script>
</body>
</html>