no message

2025-10-10 10:32:37 +08:00
commit d560b2ae9d
219 changed files with 20979 additions and 0 deletions
--- a/pages/AIHub/AITools.vue
+++ b/pages/AIHub/AITools.vue
@ -0,0 +1,125 @@
+<template>
+	<div class="tools-container">
+		<div class="card" v-for="item in 6">
+			<div class="left">
+				<img src="" />
+			</div>
+			<div class="right">
+				<div>
+					<div class="title-text">
+						AI Diagnostic Tool Analyzes 10M+ Medical Images with 99.5% Accuracy
+					</div>
+					<div class="content-text">
+						Revolutionary AI system detects diseases from X-rays, MRIs, and CT scans using a database of 10
+						million annotated images, supporting early diagnosis in 150 countries.
+					</div>
+				</div>
+
+				<div class="bottom-info">
+					<div class="first">
+						<div>
+							<img src="/logo/logo_xs.png" />
+							<span>AI toolkit</span>
+						</div>
+
+						<div class="praise">
+							<img src="/logo/praise.png" />
+							<span>{{praise_count}}</span>
+						</div>
+					</div>
+
+					<div class="time">
+						<img src="/logo/clock.png" />
+						<span>2025-07-12</span>
+					</div>
+				</div>
+			</div>
+		</div>
+		<div>
+			<Pagination :current-page="currentPage" :total-pages="totalPages" @page-change="handlePageChange" />
+			
+		</div>
+	</div>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				praise_count: 12,
+				currentPage: 1,
+				totalPages: 10, // 假设总页数为 10
+			}
+		},
+		methods: {
+			handlePageChange(pageNumber) {
+				this.currentPage = pageNumber;
+				
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.card {
+		background: $white;
+		box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05);
+		border-radius: 12px;
+		padding: 40px 30px;
+		display: flex;
+		margin-bottom: 30px;
+		gap: 30px;
+	}
+
+	.left {
+		img {
+			width: 440px;
+			height: 220px;
+			border-radius: 6px;
+		}
+
+	}
+
+	.bottom-info,
+	.right {
+		display: flex;
+		justify-content: space-between;
+
+	}
+
+	.right {
+		flex-direction: column;
+
+		.title-text {
+			margin-bottom: 14px;
+			font-weight: 600;
+			font-size: $normal-font-size;
+			color: #3A4A65;
+		}
+
+		.content-text {
+			font-weight: 400;
+			font-size: $mid-font-size;
+			color: $grey-color;
+		}
+	}
+
+	.bottom-info {
+		color: #C8CFD7;
+		font-size: 15px;
+
+		.first {
+			width: 30%;
+			display: flex;
+			justify-content: space-between
+		}
+
+		img {
+			margin-right: 8px
+		}
+
+		div {
+			@include display-flex;
+		}
+	}
+</style>