Merge branch 'master' of http://git.fmode.cn:3000/0225273/APPmy

src/app/app-routing.module.ts

@@ -9,7 +9,8 @@ const routes: Routes = [
   {
     path: 'tab4',
     loadChildren: () => import('./tab4/tab4.module').then( m => m.Tab4PageModule)
-  }
+  },
+  
 ];
 @NgModule({
   imports: [

src/app/tab1/tab1.page.html

@@ -8,74 +8,89 @@
 </ion-header>
 
 <ion-content>
-  <ion-grid>
 
-    <ion-row>
-      <ion-col size="12">
-        <!-- 搜索框 -->
-        <ion-searchbar placeholder="输入关键字搜索"></ion-searchbar>
-      </ion-col>
-    </ion-row>
+  <!-- 顶部搜索栏 -->
+  <ion-searchbar></ion-searchbar>
 
-    <!-- 导航栏 -->
-    <ion-toolbar>
-      <ion-segment value="explore">
-        <ion-segment-button value="explore">
-          发现
-        </ion-segment-button>
-        <ion-segment-button value="video">
-          视频
-        </ion-segment-button>
-        <ion-segment-button value="search">
-          搜索
-        </ion-segment-button>
-      </ion-segment>
-    </ion-toolbar>
-
-    <!-- 功能栏 -->
-    <ion-row>
-      <ion-col size="4">
-        <!-- 轮播图 -->
-      </ion-col>
-      <ion-col size="4">
-        <!-- 案例设计 -->
-      </ion-col>
-      <ion-col size="4">
-        <!-- 一键寻宝 -->
-      </ion-col>
-    </ion-row>
+  <!-- 导航栏 -->
+  <ion-toolbar>
+    <ion-segment value="explore">
+      <ion-segment-button value="explore">
+        发现
+      </ion-segment-button>
+      <ion-segment-button value="video">
+        视频
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
 
-    <ion-row>
-      <ion-col size="4">
-        <!-- 装修百科 -->
-      </ion-col>
-      <ion-col size="4">
-        <!-- 买好货 -->
-      </ion-col>
-      <ion-col size="4">
-        <!-- 关注 -->
-      </ion-col>
-    </ion-row>
-  
-    <ion-row>
-      <ion-col size="4">
-        <!-- 推荐 -->
-      </ion-col>
-      <ion-col size="4">
-        <!-- 家居 -->
-      </ion-col>
-      <ion-col size="4">
-        <!-- 设计师 -->
-      </ion-col>
-    </ion-row>
-  
-    <ion-row>
-      <ion-col size="12">
-        <!-- 附近 -->
-      </ion-col>
-    </ion-row>
+  <!-- 功能模块 -->
+  <ion-segment scrollable>
+    <ion-segment-button value="example">
+      <ion-icon name="albums"></ion-icon>
+      案例设计
+    </ion-segment-button>
+    <ion-segment-button value="design">
+      <ion-icon name="brush"></ion-icon>
+      免费设计
+    </ion-segment-button>
+    <ion-segment-button value="designer">
+      <ion-icon name="construct"></ion-icon>
+      装修施工
+    </ion-segment-button>
+    <ion-segment-button value="designer">
+      <ion-icon name="bed"></ion-icon>
+      软装搭配
+    </ion-segment-button>
+    <ion-segment-button value="designer">
+      <ion-icon name="medkit"></ion-icon>
+      户型诊断
+    </ion-segment-button>
+    <ion-segment-button value="designer">
+      <ion-icon name="bonfire"></ion-icon>
+      全屋定制
+    </ion-segment-button>
+    <ion-segment-button value="designer">
+      <ion-icon name="library"></ion-icon>
+      干货百科
+    </ion-segment-button>
+    <ion-segment-button value="designer">
+      <ion-icon name="heart-circle"></ion-icon>
+      风格测试
+    </ion-segment-button>
+    <ion-segment-button value="designer">
+      <ion-icon name="home"></ion-icon>
+      设计我家
+    </ion-segment-button>
+    <ion-segment-button value="designer">
+      <ion-icon name="calculator"></ion-icon>
+      智能预算
+    </ion-segment-button>
+  </ion-segment>
 
-    
-  
-  </ion-grid>
+  <!-- 装修锦囊块 -->
+  <ion-card>
+    <ion-card-header>
+      装修锦囊
+    </ion-card-header>
+    <ion-card-content>
+      <!-- 装修锦囊卡片 -->
+      <ion-card>
+        <ion-card-header>
+          <ion-icon name="logo"></ion-icon>
+          <ion-label>空间设计</ion-label>
+        </ion-card-header>
+        <ion-card-content>
+          <!-- 客厅怎么装card -->
+          <ion-card>
+            <ion-img src="assets/images/living_room.jpg"></ion-img>
+            <ion-card-header>
+              客厅怎么装
+            </ion-card-header>
+          </ion-card>
+          <!-- 其他装修卡片类似添加 -->
+        </ion-card-content>
+      </ion-card>
+    </ion-card-content>
+  </ion-card>
 </ion-content>

src/app/tab1/tab1.page.ts

@@ -6,7 +6,20 @@ import { Component } from '@angular/core';
   styleUrls: ['tab1.page.scss']
 })
 export class Tab1Page {
+  selectedSegment: string = 'company';
+
 
   constructor() {}
 
+  segmentChanged(event: CustomEvent) {
+    this.selectedSegment = event.detail.value;
+  }
+
+  contentList = [
+    { image: 'assets/images/image1.jpg', title: '示例标题1', user: '用户A', likes: 10, comments: 5, tags: '标签1, 标签2' },
+    { image: 'assets/images/image2.jpg', title: '示例标题2', user: '用户B', likes: 20, comments: 8, tags: '标签3, 标签4' },
+    // 添加更多示例数据
+  ];
+  
+
 }

src/app/tab3/tab3.page.html

@@ -1,34 +1,37 @@
 <ion-header [translucent]="true">
-  <ion-toolbar>
+  <ion-toolbar color="primary">
     <ion-title>
       消息
     </ion-title>
+      <ion-button (click)="openSettingsPage()">
+        <ion-icon name="settings-outline"></ion-icon>
+        <ion-label>设置</ion-label>
+      </ion-button>
   </ion-toolbar>
 </ion-header>
 
 <ion-content>
-  <ion-list>
-    <ion-item>
-      <ion-icon slot="start" name="chatbubble-ellipses"></ion-icon>
-      <ion-label>评论和回复</ion-label>
-    </ion-item>
-    
-    <ion-item>
-      <ion-icon slot="start" name="thumbs-up"></ion-icon>
-      <ion-label>赞与收藏</ion-label>
-    </ion-item>
-    
-    <ion-item>
-      <ion-icon slot="start" name="person-add"></ion-icon>
-      <ion-label>新增关注</ion-label>
-    </ion-item>
-    
-    <ion-item>
-      <ion-icon slot="start" name="notifications"></ion-icon>
-      <ion-label>系统消息</ion-label>
-    </ion-item>
-  </ion-list>
-
+  <ion-searchbar placeholder="输入关键字搜索"></ion-searchbar>
+  <ion-toolbar>
+   <ion-segment value="explore">
+    <ion-segment-button value="explore">
+      <ion-icon  name="chatbubble-ellipses"></ion-icon>
+      评论和回复
+    </ion-segment-button>
+    <ion-segment-button value="video">
+      <ion-icon  name="thumbs-up"></ion-icon>
+      赞与收藏
+    </ion-segment-button>
+    <ion-segment-button value="search">
+      <ion-icon  name="person-add"></ion-icon>
+      新增关注
+    </ion-segment-button>
+    <ion-segment-button value="system">
+      <ion-icon  name="notifications"></ion-icon>
+      系统消息
+    </ion-segment-button>
+   </ion-segment>
+  </ion-toolbar>
   <ion-card>
     <ion-card-header>
       <ion-card-title>最新推荐</ion-card-title>
@@ -44,32 +47,3 @@
     </ion-card-content>
   </ion-card>
 </ion-content>
-
-<!--<ion-footer>
-  <ion-toolbar>
-    <ion-buttons slot="start">
-      <ion-button routerLink="/tabs/tab1">
-        <ion-icon name="home"></ion-icon>
-        首页
-      </ion-button>
-    </ion-buttons>
-    <ion-buttons slot="start">
-      <ion-button routerLink="/tabs/tab2">
-        <ion-icon name="construct"></ion-icon>
-        装修
-      </ion-button>
-    </ion-buttons>
-    <ion-buttons slot="start">
-      <ion-button routerLink="/tabs/tab3" color="primary">
-        <ion-icon name="chatbubbles"></ion-icon>
-        消息
-      </ion-button>
-    </ion-buttons>
-    <ion-buttons slot="start">
-      <ion-button routerLink="/tabs/tab4">
-        <ion-icon name="person"></ion-icon>
-        我的
-      </ion-button>
-    </ion-buttons>
-  </ion-toolbar>
-</ion-footer>-->

src/app/tab3/tab3.page.scss

@@ -1,4 +1,8 @@
+.details-container {
+  padding: 10px;
+}
 ion-card {
+  top: 25px;
   margin: 10px;
 }
 
@@ -8,4 +12,7 @@ ion-card-title {
 
 ion-avatar {
   margin-right: 10px;
+}
+ion-toolbar{
+  top: 10px;
 }

src/app/tab3/tab3.page.ts

@@ -8,5 +8,13 @@ import { Component } from '@angular/core';
 export class Tab3Page {
 
   constructor() {}
+  openFeedbackPage() {
+    // 打开反馈页面
+  }
+  
+
+  openSettingsPage() {
+    // 打开设置页面
+  }
 
 }

src/app/tab4/tab4.page.html

@@ -69,14 +69,14 @@
     </ion-card-content>
   </ion-card>
   
-  <ion-card>
+  
     <ion-card-content style="justify-content: space-around">
       <p (click)="showContent('发布')">发布</p>
       <p (click)="showContent('收藏')">收藏</p>
       <p (click)="showContent('点赞')">点赞</p>
       <p (click)="showContent('浏览')">浏览</p>
     </ion-card-content>
-  </ion-card>
+  
 
   <div class="content-area">
     {{ selectedContent }}

src/app/tab4/tab4.page.scss

@@ -34,4 +34,7 @@ ion-segment {
 
 p {
   font-size: 20px; /* 设置文字大小为20px */
+}
+p:active {
+  color: blue; /* 点击后文本颜色变为蓝色 */
 }

src/app/tab4/tab4.page.ts

@@ -8,11 +8,15 @@ import { NavController } from '@ionic/angular';
 })
 export class Tab4Page implements OnInit {
 
-  constructor(private navCtrl: NavController) {}
+  constructor(private navCtrl: NavController) {this.selectedContent = '发布';}
   selectedContent: string = '';
 
   showContent(content: string) {
-    this.selectedContent = content;
+    if (content === '收藏') {
+      this.selectedContent = '一个作品都没有';
+    } else {
+      this.selectedContent = content;
+    }
   }
 
   openFeedbackPage() {