Ver código fonte

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

0225236 4 meses atrás
pai
commit
2e6f219ba9

+ 71 - 67
src/app/app-routing.module.ts

@@ -1,69 +1,73 @@
-import { NgModule } from '@angular/core';
-import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
-// 引用路由守卫
-import { authGuard } from 'src/modules/user/auth.guard';
+import { NgModule } from '@angular/core';
+import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
+// 引用路由守卫
+import { authGuard } from 'src/modules/user/auth.guard';
+
+const routes: Routes = [
+  {
+    path: '',
+    loadChildren: () => import('./tabs/tabs.module').then(m => m.TabsPageModule)
+  },
+  {
+    path: 'tab4',
+    loadChildren: () => import('./tab4/tab4.module').then( m => m.Tab4PageModule)
+  },
+  {
+    path: 'feedback',
+    loadChildren: () => import('./feedback/feedback.module').then( m => m.FeedbackPageModule)
+  },
+  {
+    path: 'settings',
+    loadChildren: () => import('./settings/settings.module').then( m => m.SettingsPageModule)
+  },
+  // {
+  //   path: 'login',
+  //   loadChildren: () => import('./login/login.module').then( m => m.LoginPageModule)
+  // },
+  {
+    path: 'edit-profile',
+    loadChildren: () => import('./edit-profile/edit-profile.module').then( m => m.EditProfilePageModule)
+  },
+  {
+    path: 'notification-settings',
+    loadChildren: () => import('./notification-settings/notification-settings.module').then( m => m.NotificationSettingsPageModule)
+  },
+  {
+    path: 'privacy',
+    loadChildren: () => import('./privacy/privacy.module').then( m => m.PrivacyPageModule)
+  },
+
+  {
+    path: 'theme-settings',
+    loadChildren: () => import('./theme-settings/theme-settings.module').then( m => m.ThemeSettingsPageModule)
+  },
+  {
+    path: 'language-settings',
+    loadChildren: () => import('./language-settings/language-settings.module').then( m => m.LanguageSettingsPageModule)
+  },
+    // 添加:
+      {
+        path: 'user',
+        loadChildren: () => import('../modules/user/user.module').then(m => m.UserModule)
+      },
+    {
+      path: 'following',
+      loadChildren: () => import('./following/following.module').then( m => m.FollowingPageModule)
+    },
+    {
+      path: 'follower',
+      loadChildren: () => import('./follower/follower.module').then( m => m.FollowerPageModule)
+    },
  {
+    path: 'creator',
+    loadChildren: () => import('./creator/creator.module').then( m => m.CreatorPageModule)
+  }
 
-const routes: Routes = [
-  {
-    path: '',
-    loadChildren: () => import('./tabs/tabs.module').then(m => m.TabsPageModule)
-  },
-  {
-    path: 'tab4',
-    loadChildren: () => import('./tab4/tab4.module').then( m => m.Tab4PageModule)
-  },
-  {
-    path: 'feedback',
-    loadChildren: () => import('./feedback/feedback.module').then( m => m.FeedbackPageModule)
-  },
-  {
-    path: 'settings',
-    loadChildren: () => import('./settings/settings.module').then( m => m.SettingsPageModule)
-  },
-  // {
-  //   path: 'login',
-  //   loadChildren: () => import('./login/login.module').then( m => m.LoginPageModule)
-  // },
-  {
-    path: 'edit-profile',
-    loadChildren: () => import('./edit-profile/edit-profile.module').then( m => m.EditProfilePageModule)
-  },
-  {
-    path: 'notification-settings',
-    loadChildren: () => import('./notification-settings/notification-settings.module').then( m => m.NotificationSettingsPageModule)
-  },
-  {
-    path: 'privacy',
-    loadChildren: () => import('./privacy/privacy.module').then( m => m.PrivacyPageModule)
-  },
-
-  {
-    path: 'theme-settings',
-    loadChildren: () => import('./theme-settings/theme-settings.module').then( m => m.ThemeSettingsPageModule)
-  },
-  {
-    path: 'language-settings',
-    loadChildren: () => import('./language-settings/language-settings.module').then( m => m.LanguageSettingsPageModule)
-  },
-    // 添加:
-      {
-        path: 'user',
-        loadChildren: () => import('../modules/user/user.module').then(m => m.UserModule)
-      },
-    {
-      path: 'following',
-      loadChildren: () => import('./following/following.module').then( m => m.FollowingPageModule)
-    },
-    {
-      path: 'follower',
-      loadChildren: () => import('./follower/follower.module').then( m => m.FollowerPageModule)
-    }
-
-];
-@NgModule({
-  imports: [
-    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
-  ],
-  exports: [RouterModule]
-})
+
+];
+@NgModule({
+  imports: [
+    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
+  ],
+  exports: [RouterModule]
+})
 export class AppRoutingModule {}

+ 17 - 0
src/app/creator/creator-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { CreatorPage } from './creator.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: CreatorPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class CreatorPageRoutingModule {}

+ 20 - 0
src/app/creator/creator.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { CreatorPageRoutingModule } from './creator-routing.module';
+
+import { CreatorPage } from './creator.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    CreatorPageRoutingModule
+  ],
+  declarations: [CreatorPage]
+})
+export class CreatorPageModule {}

+ 13 - 0
src/app/creator/creator.page.html

@@ -0,0 +1,13 @@
+<ion-header [translucent]="true">
+  <ion-toolbar>
+    <ion-title>creator</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+  <ion-header collapse="condense">
+    <ion-toolbar>
+      <ion-title size="large">creator</ion-title>
+    </ion-toolbar>
+  </ion-header>
+</ion-content>

+ 0 - 0
src/app/creator/creator.page.scss


+ 17 - 0
src/app/creator/creator.page.spec.ts

@@ -0,0 +1,17 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { CreatorPage } from './creator.page';
+
+describe('CreatorPage', () => {
+  let component: CreatorPage;
+  let fixture: ComponentFixture<CreatorPage>;
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CreatorPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

+ 15 - 0
src/app/creator/creator.page.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-creator',
+  templateUrl: './creator.page.html',
+  styleUrls: ['./creator.page.scss'],
+})
+export class CreatorPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

+ 2 - 2
src/app/feedback/feedback.page.html

@@ -1,9 +1,9 @@
 <ion-header [translucent]="true">
-  <ion-toolbar>
+  <ion-toolbar style="height: 60px">
     <ion-buttons slot="start">
       <ion-back-button defaultHref="/tabs/tab4"></ion-back-button>
     </ion-buttons>
-    <ion-title style="font-size:30px">反馈</ion-title>
+    <ion-title style="font-size:25px" >反馈</ion-title>
   </ion-toolbar>
 </ion-header>
 

+ 3 - 0
src/app/feedback/feedback.page.scss

@@ -0,0 +1,3 @@
+// ion-header {
+//   --min-height: 80px !important; /* 设置 header 的最小高度为 80px,你可以根据需要调整高度 */
+// }

+ 18 - 26
src/app/tab1/tab1.page.html

@@ -308,32 +308,24 @@
   <!-- 视频页 -->
   <div *ngIf="selectedSegment === 'video'">
     <!-- 视频内容 -->
-    <div class="like-wrapper">
-      <input class="check" type="checkbox" id="like-toggle" />
-      <label class="container" for="like-toggle">
-        <svg
-          viewBox="0 0 512 512"
-          xmlns="http://www.w3.org/2000/svg"
-          class="icon inactive"
-        >
-          <path
-            d="M225.8 468.2l-2.5-2.3L48.1 303.2C17.4 274.7 0 234.7 0 192.8v-3.3c0-70.4 50-130.8 119.2-144C158.6 37.9 198.9 47 231 69.6c9 6.4 17.4 13.8 25 22.3c4.2-4.8 8.7-9.2 13.5-13.3c3.7-3.2 7.5-6.2 11.5-9c0 0 0 0 0 0C313.1 47 353.4 37.9 392.8 45.4C462 58.6 512 119.1 512 189.5v3.3c0 41.9-17.4 81.9-48.1 110.4L288.7 465.9l-2.5 2.3c-8.2 7.6-19 11.9-30.2 11.9s-22-4.2-30.2-11.9zM239.1 145c-.4-.3-.7-.7-1-1.1l-17.8-20c0 0-.1-.1-.1-.1c0 0 0 0 0 0c-23.1-25.9-58-37.7-92-31.2C81.6 101.5 48 142.1 48 189.5v3.3c0 28.5 11.9 55.8 32.8 75.2L256 430.7 431.2 268c20.9-19.4 32.8-46.7 32.8-75.2v-3.3c0-47.3-33.6-88-80.1-96.9c-34-6.5-69 5.4-92 31.2c0 0 0 0-.1 .1s0 0-.1 .1l-17.8 20c-.3 .4-.7 .7-1 1.1c-4.5 4.5-10.6 7-16.9 7s-12.4-2.5-16.9-7z"
-          ></path>
-        </svg>
-        <svg
-          viewBox="0 0 512 512"
-          xmlns="http://www.w3.org/2000/svg"
-          class="icon active"
-        >
-          <path
-            d="M47.6 300.4L228.3 469.1c7.5 7 17.4 10.9 27.7 10.9s20.2-3.9 27.7-10.9L464.4 300.4c30.4-28.3 47.6-68 47.6-109.5v-5.8c0-69.9-50.5-129.5-119.4-141C347 36.5 300.6 51.4 268 84L256 96 244 84c-32.6-32.6-79-47.5-124.6-39.9C50.5 55.6 0 115.2 0 185.1v5.8c0 41.5 17.2 81.2 47.6 109.5z"
-          ></path>
-        </svg>
-        <div class="checkmark"></div>
-        <span class="like-text">like</span>
-      </label>
-    </div>
-    <img src="assets\img\customer-avatar.jpg" alt="Example 0">
+    <ion-grid>
+      <ion-row>
+        <ion-col size="12" size-md="6" size-lg="4" *ngFor="let video of videos">
+          <ion-card>
+            <video width="100%" controls>
+              <source [src]="video.videoUrl" type="video/mp4">
+              Your browser does not support the video tag.
+            </video>
+            <ion-card-header>
+              <ion-card-title>{{video.title}}</ion-card-title>
+            </ion-card-header>
+            <ion-card-content>
+              {{video.description}}
+            </ion-card-content>
+          </ion-card>
+        </ion-col>
+      </ion-row>
+    </ion-grid>
   </div>
 
   <!-- 案例设计页 -->

+ 10 - 0
src/app/tab1/tab1.page.scss

@@ -325,4 +325,14 @@ p {
 .swiper-slide img {
   display: block;
   width: 100%;
+}
+
+ion-card {
+  margin: 10px;
+}
+
+ion-card img {
+  width: 100%;
+  height: 200px;
+  object-fit: cover;
 }

+ 53 - 1
src/app/tab1/tab1.page.ts

@@ -53,7 +53,59 @@ export class Tab1Page implements OnInit {
     // 添加更多示例数据
   ];
   
-
+  videos: { videoUrl: string, title: string, description: string }[] = [
+    {
+      videoUrl: 'assets/videos/video1.mp4',
+      title: '房屋装修设计指南',
+      description: '了解如何打造理想的家居装修风格'
+    },
+    {
+      videoUrl: 'assets/videos/video2.mp4',
+      title: '家具选购攻略',
+      description: '挑选适合你家的家具,打造舒适空间'
+    },
+    {
+      videoUrl: 'assets/videos/video3.mp4',
+      title: '客厅装饰灵感',
+      description: '打造温馨舒适的客厅装饰'
+    },
+    {
+      videoUrl: 'assets/videos/video4.mp4',
+      title: '卧室设计技巧',
+      description: '掌握卧室设计的实用技巧'
+    },
+    {
+      videoUrl: 'assets/videos/video5.mp4',
+      title: '厨房装修实例',
+      description: '欣赏不同风格的厨房装修案例'
+    },
+    {
+      videoUrl: 'assets/videos/video6.mp4',
+      title: '阳台花园布置',
+      description: '打造美丽的阳台花园'
+    },
+    {
+      videoUrl: 'assets/videos/video7.mp4',
+      title: '书房设计灵感',
+      description: '打造宁静的读书空间'
+    },
+    {
+      videoUrl: 'assets/videos/video8.mp4',
+      title: '浴室装修技巧',
+      description: '打造舒适的浴室空间'
+    },
+    {
+      videoUrl: 'assets/videos/video9.mp4',
+      title: '家居风水指南',
+      description: '了解家居风水的重要性'
+    },
+    {
+      videoUrl: 'assets/videos/video10.mp4',
+      title: '家庭影院布置',
+      description: '打造私人家庭影院'
+    }
+    // 可以根据需要添加更多视频数据
+  ];
 
 
 

+ 2 - 2
src/app/tab2/tab2.page.spec.ts

@@ -1,7 +1,7 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
 
-import { ExploreContainerComponentModule } from '../explore-container/explore-container.module';
+//import { ExploreContainerComponentModule } from '../explore-container/explore-container.module';
 
 import { Tab2Page } from './tab2.page';
 
@@ -12,7 +12,7 @@ describe('Tab2Page', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       declarations: [Tab2Page],
-      imports: [IonicModule.forRoot(), ExploreContainerComponentModule]
+      //imports: [IonicModule.forRoot(), ExploreContainerComponentModule]
     }).compileComponents();
 
     fixture = TestBed.createComponent(Tab2Page);

+ 5 - 3
src/app/tab3/tab3.page.html

@@ -1,5 +1,5 @@
 <ion-header [translucent]="true">
-  <ion-toolbar color="primary">
+  <ion-toolbar>
     <ion-title>
       消息
     </ion-title>
@@ -11,6 +11,7 @@
 </ion-header>
 
 <ion-content>
+<div style="background-image: url(assets/img/c.jpg);">
   <ion-searchbar placeholder="输入关键字搜索"></ion-searchbar>
   <ion-card class="card">
     <ion-card-header >
@@ -65,7 +66,8 @@
       </ion-label>
     </ion-item>
     <ion-item>
-      <ion-input placeholder="添加评论"></ion-input>
+      <ion-input placeholder="添加评论" ></ion-input>
+      <ion-button slot="start" (click)="sendComment()"></ion-button>
       <ion-button slot="end" (click)="sendComment()">
         <ion-icon name="send"></ion-icon>
       </ion-button>
@@ -156,5 +158,5 @@
     </ion-item>
    </div>
   </div>
-
+</div>
 </ion-content>

+ 1 - 0
src/app/tab3/tab3.page.scss

@@ -23,6 +23,7 @@ ion-avatar {
   perspective: 1000px;
   transition: all 0.5s cubic-bezier(0.23, 1, 0.320, 1);
   cursor: pointer;
+  
 }
 
 

+ 8 - 12
src/app/tab4/tab4.page.html

@@ -1,5 +1,5 @@
 <ion-header [translucent]="true">
-  <ion-toolbar>
+  <ion-toolbar >
     <!-- <ion-title>我的</ion-title> -->
     <ion-buttons slot="end">
       <ion-button (click)="openFeedbackPage()">
@@ -18,7 +18,8 @@
 
 <ion-content>
 
-    <ion-card-content>
+    <ion-card-content class="user-info" style="background-image: url('https://img-baofun.zhhainiao.com/fs/418d45e9ae341aa1760e2368d166dc3c.jpg');">
+      
       <ion-avatar style="margin-left:15px;margin-top:15px; transform:scale(1.8)">
         <img src="https://ionicframework.com/docs/img/demos/avatar.svg" alt="User Avatar">
       </ion-avatar>
@@ -50,29 +51,24 @@
     </ion-col>
   </ion-row>
 </ion-grid>
+    
     <ion-card-content>
-    <ion-segment scrollable>
-    <ion-segment-button value="creators">
+    <ion-segment-button value="creators" (click)="openLogin2Page()">
       <ion-icon name="color-palette-outline"></ion-icon>
       创作者中心
     </ion-segment-button>
-    <ion-segment-button value="circles">
+    <ion-segment-button value="circles" (click)="openLogin2Page()">
       <ion-icon name="chatbubbles-outline"></ion-icon>
       我的圈子
     </ion-segment-button>
-    <ion-segment-button value="my-orders">
+    <ion-segment-button value="my-orders" (click)="openLogin2Page()">
       <ion-icon name="receipt-outline"></ion-icon>
       我的订单
     </ion-segment-button>
-    <ion-segment-button value="decor-assistant">
-      <ion-icon name="hammer-outline"></ion-icon>
-      装修助手
-    </ion-segment-button>
-    <ion-segment-button value="apply-verification">
+    <ion-segment-button value="apply-verification" (click)="openLogin2Page()">
       <ion-icon name="shield-checkmark-outline"></ion-icon>
       申请认证
     </ion-segment-button>
-  </ion-segment>
     </ion-card-content>
   </ion-card>
   

+ 15 - 4
src/app/tab4/tab4.page.scss

@@ -16,12 +16,12 @@ ion-card {
     font-weight: bold;
   }
   
-  ion-button {
-    margin: 15px;
-  }
+  // ion-button {
+  //   margin: 15px;
+  // }
 
 ion-segment-button {
- 
+  width:100px;
   font-size: 15px; /* 设置按钮字体大小为20px,让按钮整体看起来更大 */
   padding: 10px 0px; /* 设置按钮内边距,增加按钮的大小 */
 }
@@ -60,3 +60,14 @@ ion-col {
     color: #999;
   }
 }
+
+.user-info {
+  background-size: cover;
+  background-position: center;
+  background-repeat: no-repeat;
+  display: flex;
+  // align-items: center;
+  // justify-content: center;
+  height: 150px; /* 设置容器高度 */
+  position: relative;
+}

+ 9 - 0
src/app/tab4/tab4.page.ts

@@ -77,6 +77,15 @@ export class Tab4Page implements OnInit {
     this.navCtrl.navigateForward('/user/login');
   }
 
+  openLogin2Page() {
+    //按钮
+    if (this.user?.id) {
+    this.router.navigate(['/creator']); // 如果已登录,跳转到 creator 页面
+  } else {
+    this.navCtrl.navigateForward('/user/login'); // 如果未登录,跳转到 login 页面
+  }
+  }
+
   openFollowingPage(){
     //打开关注页面
     this.router.navigate(['/following']);

BIN
src/assets/img/c.jpg


BIN
src/assets/videos/video1.mp4


BIN
src/assets/videos/video10.mp4


BIN
src/assets/videos/video2.mp4


BIN
src/assets/videos/video3.mp4


BIN
src/assets/videos/video4.mp4


BIN
src/assets/videos/video5.mp4


BIN
src/assets/videos/video6.mp4


BIN
src/assets/videos/video7.mp4


BIN
src/assets/videos/video8.mp4


BIN
src/assets/videos/video9.mp4


+ 2 - 2
src/modules/user/login/login.page.html

@@ -1,6 +1,6 @@
 <ion-header [translucent]="true">
-  <ion-toolbar>
-    <ion-title>登录/注册</ion-title>
+  <ion-toolbar style="height: 60px">
+    <!-- <ion-title style="fofont-size: 25px">登录/注册</ion-title> -->
   </ion-toolbar>
 </ion-header>