|
|
@@ -1,16 +1,152 @@
|
|
|
import { Component } from '@angular/core';
|
|
|
-import { IonHeader, IonToolbar, IonTitle, IonContent } from '@ionic/angular/standalone';
|
|
|
+// import { IonHeader, IonToolbar, IonTitle, IonContent,IonButton, IonButtons } from '@ionic/angular/standalone';
|
|
|
import { ExploreContainerComponent } from '../explore-container/explore-container.component';
|
|
|
+import { FormsModule } from '@angular/forms';
|
|
|
+import { CommonModule } from '@angular/common';
|
|
|
+import { IonicModule } from '@ionic/angular';
|
|
|
|
|
|
@Component({
|
|
|
selector: 'app-tab2',
|
|
|
templateUrl: 'tab2.page.html',
|
|
|
styleUrls: ['tab2.page.scss'],
|
|
|
standalone: true,
|
|
|
- imports: [IonHeader, IonToolbar, IonTitle, IonContent, ExploreContainerComponent]
|
|
|
+ imports: [CommonModule, FormsModule,
|
|
|
+ IonicModule, ExploreContainerComponent]
|
|
|
})
|
|
|
export class Tab2Page {
|
|
|
+ selectedSegment: string = 'collection';
|
|
|
+ books: any[] = [
|
|
|
+ { title: '唐诗鉴赏辞典', count: 1100, category: '书籍' },
|
|
|
+ { title: '宋词鉴赏辞典', count: 1294, category: '书籍' },
|
|
|
+ { title: '唐宋词鉴赏辞典', count: 1500, category: '书籍' },
|
|
|
+ { title: '元明清词鉴赏辞典', count: 840, category: '书籍' },
|
|
|
+ { title: '新诗鉴赏辞典', count: 909, category: '书籍' },
|
|
|
+ { title: '历代女性诗词鉴赏辞典', count: 652, category: '书籍' },
|
|
|
+ { title: '历代赋鉴赏辞典', count: 250, category: '书籍' },
|
|
|
+ { title: '先秦诗鉴赏辞典', count: 370, category: '书籍' },
|
|
|
+ { title: '汉魏六朝诗鉴赏辞典', count: 930, category: '书籍' },
|
|
|
+ { title: '古文鉴赏辞典', count: 566, category: '书籍' },
|
|
|
+ { title: '古代志怪小说鉴赏辞典', count: 539, category: '书籍' },
|
|
|
+ { title: '唐宋小说鉴赏辞典', count: 335, category: '书籍' },
|
|
|
+ { title: '明清鉴赏辞典', count: 243, category: '书籍' },
|
|
|
+ { title: '明清传奇鉴赏辞典', count: 281, category: '书籍' },
|
|
|
+ { title: '宋词300首鉴赏辞典', count: 396, category: '书籍' },
|
|
|
+ { title: '诗经鉴赏辞典', count: 231, category: '书籍' },
|
|
|
+ { title: '唐诗300首鉴赏辞典', count: 312, category: '书籍' },
|
|
|
+ { title: '元曲300首鉴赏辞典', count: 404, category: '书籍' },
|
|
|
+ { title: '中华诗词名句鉴赏辞典', count: 31, category: '书籍' },
|
|
|
+ { title: '诸子百家名句鉴赏辞典', count: 198, category: '书籍' }
|
|
|
+ ];
|
|
|
+ filteredBooks: any[] = [];
|
|
|
+ categories: string[] = [
|
|
|
+ '书籍', '选集', '主题', '写景', '节日', '节气', '词牌', '时间', '时令', '花卉', '课本', '地理', '城市', '名山', '用典'
|
|
|
+ ];
|
|
|
+// 定义每个分类对应的书籍列表
|
|
|
+ categoryBooks: { [key: string]: any[] } = {
|
|
|
+ '选集': [
|
|
|
+ { title: '诗经全集', count: 305, category: '选集' },
|
|
|
+ { title: '楚辞全集', count: 17, category: '选集' },
|
|
|
+ { title: '道德经', count: 81, category: '选集' }
|
|
|
+ ],
|
|
|
+ '主题': [
|
|
|
+ { title: '爱', count: 100, category: '主题' },
|
|
|
+ { title: '禅', count: 50, category: '主题' },
|
|
|
+ { title: '茶', count: 60, category: '主题' }
|
|
|
+ ],
|
|
|
+ '写景': [
|
|
|
+ { title: '春', count: 200, category: '写景' },
|
|
|
+ { title: '夏', count: 150, category: '写景' },
|
|
|
+ { title: '秋', count: 180, category: '写景' }
|
|
|
+ ],
|
|
|
+ '节日': [
|
|
|
+ { title: '春节', count: 30, category: '节日' },
|
|
|
+ { title: '元宵', count: 20, category: '节日' },
|
|
|
+ { title: '寒食', count: 15, category: '节日' }
|
|
|
+ ],
|
|
|
+ '节气': [
|
|
|
+ { title: '立春', count: 10, category: '节气' },
|
|
|
+ { title: '雨水', count: 12, category: '节气' },
|
|
|
+ { title: '惊蛰', count: 8, category: '节气' }
|
|
|
+ ],
|
|
|
+ '词牌': [
|
|
|
+ { title: '如梦令', count: 5, category: '词牌' },
|
|
|
+ { title: '醉花阴', count: 7, category: '词牌' },
|
|
|
+ { title: '虞美人', count: 6, category: '词牌' }
|
|
|
+ ],
|
|
|
+ '时间': [
|
|
|
+ { title: '正月', count: 25, category: '时间' },
|
|
|
+ { title: '二月', count: 20, category: '时间' },
|
|
|
+ { title: '三月', count: 18, category: '时间' }
|
|
|
+ ],
|
|
|
+ '时令': [
|
|
|
+ { title: '樱桃', count: 10, category: '时令' },
|
|
|
+ { title: '荔枝', count: 8, category: '时令' },
|
|
|
+ { title: '杨梅', count: 9, category: '时令' }
|
|
|
+ ],
|
|
|
+ '花卉': [
|
|
|
+ { title: '牡丹', count: 15, category: '花卉' },
|
|
|
+ { title: '梅花', count: 12, category: '花卉' },
|
|
|
+ { title: '桃花', count: 14, category: '花卉' }
|
|
|
+ ],
|
|
|
+ '课本': [
|
|
|
+ { title: '小学古诗词', count: 75, category: '课本' },
|
|
|
+ { title: '小学文言文', count: 30, category: '课本' },
|
|
|
+ { title: '初中古诗词', count: 50, category: '课本' }
|
|
|
+ ],
|
|
|
+ '地理': [
|
|
|
+ { title: '黄鹤楼', count: 5, category: '地理' },
|
|
|
+ { title: '西湖', count: 7, category: '地理' },
|
|
|
+ { title: '洞庭湖', count: 6, category: '地理' }
|
|
|
+ ],
|
|
|
+ '城市': [
|
|
|
+ { title: '洛阳', count: 10, category: '城市' },
|
|
|
+ { title: '长安', count: 12, category: '城市' },
|
|
|
+ { title: '北京', count: 15, category: '城市' }
|
|
|
+ ],
|
|
|
+ '名山': [
|
|
|
+ { title: '黄山', count: 8, category: '名山' },
|
|
|
+ { title: '泰山', count: 9, category: '名山' },
|
|
|
+ { title: '衡山', count: 7, category: '名山' }
|
|
|
+ ],
|
|
|
+ '用典': [
|
|
|
+ { title: '敬民篇', count: 10, category: '用典' },
|
|
|
+ { title: '治理篇', count: 8, category: '用典' },
|
|
|
+ { title: '修身篇', count: 9, category: '用典' }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ constructor() {
|
|
|
+ this.filteredBooks = this.books;
|
|
|
+ }
|
|
|
+ segmentChanged(event: any) {
|
|
|
+ const newSegment = event.detail.value;
|
|
|
+ if (newSegment === 'collection') {
|
|
|
+ this.selectCategory(this.categories[0]); // 默认选择第一个类别
|
|
|
+ } else {
|
|
|
+ this.filteredBooks = []; // 清空书籍列表
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- constructor() {}
|
|
|
+ selectBook(book: any) {
|
|
|
+ console.log('Selected book:', book);
|
|
|
+ }
|
|
|
+
|
|
|
+ openSearch() {
|
|
|
+ console.log('Search clicked');
|
|
|
+ }
|
|
|
+
|
|
|
+ selectCategory(category: string) {
|
|
|
+ console.log('Selected category:', category);
|
|
|
+ // 根据类别筛选书籍
|
|
|
+ if (this.categoryBooks[category]) {
|
|
|
+ this.filteredBooks = this.categoryBooks[category];
|
|
|
+ } else {
|
|
|
+ this.filteredBooks = this.books.filter(book => book.category === category);
|
|
|
+
|
|
|
+ // 如果没有匹配到任何书籍，显示提示信息
|
|
|
+ if (this.filteredBooks.length === 0) {
|
|
|
+ this.filteredBooks = [{ title: '暂无相关书籍', count: 0 }];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
-}
|
危齐晟