|
|
@@ -1,5 +1,5 @@
|
|
|
import { Component, NgModule } from '@angular/core';
|
|
|
-import { ModalController, IonModal, IonHeader, IonToolbar, IonTitle, IonContent, IonList, IonItem, IonLabel, IonAvatar, IonButton, IonSegment, IonSegmentButton, IonSegmentContent, IonSegmentView, IonCardContent, IonCardTitle, IonCardHeader, IonCard, IonIcon, IonButtons } from '@ionic/angular/standalone';
|
|
|
+import { ModalController, IonModal, IonHeader, IonToolbar, IonTitle, IonContent, IonList, IonItem, IonLabel, IonAvatar, IonButton, IonSegment, IonSegmentButton, IonSegmentContent, IonSegmentView, IonCardContent, IonCardTitle, IonCardHeader, IonCard, IonIcon, IonButtons, IonSearchbar } from '@ionic/angular/standalone';
|
|
|
import { ExploreContainerComponent } from '../explore-container/explore-container.component';
|
|
|
import { addIcons } from 'ionicons';
|
|
|
import { airplane, bluetooth, call, wifi } from 'ionicons/icons';
|
|
|
@@ -8,8 +8,6 @@ import { CommonModule } from '@angular/common';
|
|
|
import { CloudObject, CloudQuery } from 'src/lib/ncloud';
|
|
|
import { NavigationLanComponent } from '../component/navigation-lan/navigation-lan.component';
|
|
|
import { Router } from '@angular/router';
|
|
|
-import { cardDisplay } from '../page/data-modal/data-modal.component';
|
|
|
-import { openUserLoginModal } from 'src/lib/user/modal-user-login/modal-user-login.component';
|
|
|
addIcons({ airplane, bluetooth, call, wifi });
|
|
|
|
|
|
@Component({
|
|
|
@@ -22,14 +20,34 @@ addIcons({ airplane, bluetooth, call, wifi });
|
|
|
IonLabel,IonItem,IonList,IonAvatar,ArticleCardComponent,CommonModule,IonButton,
|
|
|
IonSegment, IonSegmentButton,NavigationLanComponent,
|
|
|
IonSegmentContent,IonSegmentView,IonCardContent, IonCardTitle, IonCardHeader,IonCard,
|
|
|
- IonModal,IonIcon, IonButtons,
|
|
|
+ IonModal,IonIcon, IonButtons, IonSearchbar
|
|
|
]
|
|
|
})
|
|
|
|
|
|
export class Tab2Page {
|
|
|
+ products: Array<CloudObject> = []; // 当前显示的科普信息
|
|
|
+ allCards: Array<CloudObject> = []; // 所有科普信息
|
|
|
+
|
|
|
+ //搜索功能
|
|
|
+ searchTerm: string = '';
|
|
|
+
|
|
|
+ async searchProducts(event: any) {
|
|
|
+ this.searchTerm = event.detail.value.toLowerCase();
|
|
|
+ if (this.searchTerm) {
|
|
|
+ this.products = this.allCards.filter(product =>
|
|
|
+ product.get('topic').toLowerCase().includes(this.searchTerm) ||
|
|
|
+ product.get('title').toLowerCase().includes(this.searchTerm) ||
|
|
|
+ product.get('category').toLowerCase().includes(this.searchTerm) ||
|
|
|
+ product.get('content')[0].toLowerCase().includes(this.searchTerm)
|
|
|
+ );
|
|
|
+ } else {
|
|
|
+ this.products = [...this.allCards]; // 如果搜索词为空，则显示所有科普信息
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
isModalOpen = false;
|
|
|
currentProduct: any; // 当前选择的科普信息
|
|
|
+
|
|
|
openDetailModal(product?: any) {
|
|
|
this.isModalOpen = true;
|
|
|
this.currentProduct = product;
|
|
|
@@ -60,26 +78,24 @@ export class Tab2Page {
|
|
|
copyLink() {
|
|
|
console.log('复制链接');
|
|
|
}
|
|
|
- type:"hotdot"|"export"|"sleep"|"lift"|"male"|"female" = "hotdot"
|
|
|
+ type:"hotdot"|"export"|"sleep"|"life"|"男"|"女" = "hotdot"
|
|
|
|
|
|
constructor(
|
|
|
private modalCtrl:ModalController,
|
|
|
private router:Router,
|
|
|
) { }
|
|
|
|
|
|
- cards: Array<CloudObject> = [];
|
|
|
- typeChange(ev: any) {
|
|
|
+ cards: Array<CloudObject> = []; // 当前显示的分类卡片
|
|
|
+ async typeChange(ev: any) {
|
|
|
this.type = ev?.detail?.value || ev?.value || 'hotdot';
|
|
|
console.log(this.type);
|
|
|
- this.loadCards(); // 重新加载卡片
|
|
|
+ await this.loadCards(); // 重新加载卡片
|
|
|
}
|
|
|
|
|
|
async loadCards() {
|
|
|
const query = new CloudQuery('HotDot');
|
|
|
- // if (this.type) {
|
|
|
- // query.equalTo('category', this.type); // 根据选择的类型设置查询条件
|
|
|
- // }
|
|
|
- this.cards = await query.find(); // 执行查询并获取结果
|
|
|
+ this.allCards = await query.find(); // 执行查询并获取结果
|
|
|
+ this.cards = this.allCards.filter((card) => card.get('category').toLowerCase().includes(this.type));
|
|
|
}
|
|
|
|
|
|
ngOnInit() {
|
