对接数据

2025-10-24 15:45:38 +08:00
parent 672a2f4c90
commit d3375a347f
138 changed files with 16904 additions and 1026 deletions
--- a/pages/Learn/Depth.vue
+++ b/pages/Learn/Depth.vue
@ -0,0 +1,103 @@
+<template>
+	<div class="container" v-loading.fullscreen.lock="fullscreenLoading">
+		<div class="top-text">
+			<div class="title">In-Depth Analysis</div>
+			<div class="description">
+				Provides thorough articles, case studies, and technical breakdowns. Analyze AI topics from both theoretical and practical perspectives, offering valuable guidance for professionals, researchers, and enthusiasts looking to deepen their understanding.
+			</div>
+		</div>
+		<div class="input">
+			<SearchInput v-model="searchText" placeholder="Please enter the key words" @search="handleTextSearch" />
+		</div>
+		<div class="list">
+			<ListCardItem v-for="it in articleList" :key="it.id" :item="it" type="analysis" />
+		</div>
+		<div class="pagination-wrapper">
+			<Pagination :current-page="currentPage" :total-pages="totalPages" @page-change="handlePageChange" />
+		</div>
+	</div>
+</template>
+
+<script>
+import ListCardItem from "@/pages/AIHub/components/ListCardItem.vue";
+
+export default {
+	components: {
+		ListCardItem,
+	},
+	data() {
+		return {
+			currentPage: 1,
+			totalPages: 1,
+			pageSize: 10,
+			articleList: [],
+			searchText: '',
+			total: 0,
+			fullscreenLoading: false,
+		}
+	},
+	methods: {
+		// 模糊搜索
+		async handleTextSearch() {
+			await this.getArticleListData(this.currentPage, this.pageSize, this.searchText);
+		},
+		calculateTotalPages() {
+			// 否则向上取整计算总页数
+			this.totalPages = this.total === 0 ? 1 : Math.ceil(this.total / this.pageSize);
+		},
+		handlePageChange(pageNumber) {
+			this.currentPage = pageNumber;
+			this.getArticleListData(pageNumber, 10);
+		},
+		// 获取文章列表
+		async getArticleListData(page = 1, limit = 10, searchText) {
+			this.fullscreenLoading = true;
+			const params = {page, limit, articleType: 'analysis', title: searchText};
+			if (!searchText) {
+				delete params.title;
+			}
+			const {data: res} = await this.$api.article.getArticleList(params);
+			const {code, data} = res;
+			if (code === 0 && data.list) {
+				this.articleList = data.list;
+				this.total = data.total;
+				this.calculateTotalPages();
+			}
+			this.fullscreenLoading = false;
+		}
+	},
+	mounted() {
+		this.getArticleListData(this.currentPage, this.pageSize);
+	}
+}
+</script>
+
+<style scoped lang="scss">
+.container {
+	.title {
+		font-weight: bold;
+		font-size: $huge-font-size1;
+	}
+
+	.description {
+		font-size: $big-font-size;
+		color: $grey-color;
+	}
+
+	.input {
+		display: flex;
+		justify-content: flex-end;
+		.input-container {
+			margin-top: 100px;
+			margin-bottom: 60px;
+		}
+	}
+
+	.list {
+		display: flex;
+		flex-direction: column;
+		gap: 30px;
+		margin-bottom: 60px;
+	}
+}
+</style>