fit:create dynamic

myapp/src/app/tab2/dynamic-create/dynamic-create-routing.module.ts

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

myapp/src/app/tab2/dynamic-create/dynamic-create.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 { DynamicCreatePageRoutingModule } from './dynamic-create-routing.module';
+
+import { DynamicCreatePage } from './dynamic-create.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    DynamicCreatePageRoutingModule
+  ],
+  declarations: [DynamicCreatePage]
+})
+export class DynamicCreatePageModule {}

myapp/src/app/tab2/dynamic-create/dynamic-create.page.html

@@ -0,0 +1,58 @@
+<ion-header>
+  <ion-toolbar>
+    <ion-buttons slot="start">
+      <ion-back-button defaultHref="/tabs/tab2"></ion-back-button>
+    </ion-buttons>
+    <ion-title>发布动态</ion-title>
+    <ion-buttons slot="end">
+      <ion-button (click)="submitDynamic()" [disabled]="!content">发布</ion-button>
+    </ion-buttons>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content>
+  <form (ngSubmit)="submitDynamic()">
+    <ion-item>
+      <ion-textarea 
+        [(ngModel)]="content" 
+        name="content"
+        placeholder="分享你的心情..." 
+        rows="6"
+        autoGrow="true"
+        required>
+      </ion-textarea>
+    </ion-item>
+
+    <ion-item>
+      <ion-label>上传图片</ion-label>
+      <input 
+        type="file" 
+        (change)="onFileChange($event)" 
+        accept="image/*" 
+        multiple
+        #fileInput
+        style="display: none">
+      <ion-button fill="clear" (click)="fileInput.click()">
+        <ion-icon name="image-outline" slot="start"></ion-icon>
+        选择图片
+      </ion-button>
+    </ion-item>
+
+    <div class="image-preview" *ngIf="images.length > 0">
+      <div class="preview-item" *ngFor="let img of images; let i = index">
+        <img [src]="img.url">
+        <ion-icon name="close-circle" (click)="removeImage(i)"></ion-icon>
+      </div>
+    </div>
+
+    <!-- <ion-item>
+      <ion-label>当前时间</ion-label>
+      <ion-datetime 
+        displayFormat="YYYY-MM-DD HH:mm" 
+        [(ngModel)]="currentTime" 
+        name="currentTime"
+        disabled>
+      </ion-datetime>
+    </ion-item> -->
+  </form>
+</ion-content>

myapp/src/app/tab2/dynamic-create/dynamic-create.page.spec.ts

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

myapp/src/app/tab2/dynamic-create/dynamic-create.page.ts

@@ -0,0 +1,128 @@
+import { Component, OnInit } from '@angular/core';
+import { NavController } from '@ionic/angular';
+import { Router } from '@angular/router';
+import { CloudObject, CloudUser } from 'src/lib/ncloud';
+import { AlertController } from '@ionic/angular';
+
+@Component({
+  selector: 'app-dynamic-create',
+  templateUrl: './dynamic-create.page.html',
+  styleUrls: ['./dynamic-create.page.scss'],
+  standalone:false,
+})
+export class DynamicCreatePage implements OnInit {
+
+  content = '';
+  images: {file: File, url: string}[] = [];
+  currentTime = new Date().toISOString();
+  currentUser: any = null;
+
+  constructor(
+    private navCtrl: NavController,
+    private router: Router,
+    private alertController: AlertController
+  ) {}
+
+  async ngOnInit() {
+    // 获取当前用户
+    this.currentUser = new CloudUser();
+    await this.currentUser.current();
+  }
+
+  onFileChange(event: any) {
+    const files = event.target.files;
+    if (files && files.length > 0) {
+      for (let i = 0; i < files.length; i++) {
+        const file = files[i];
+        if (file.type.match('image.*')) {
+          const reader = new FileReader();
+          reader.onload = (e: any) => {
+            this.images.push({
+              file: file,
+              url: e.target.result
+            });
+          };
+          reader.readAsDataURL(file);
+        }
+      }
+    }
+  }
+
+  removeImage(index: number) {
+    this.images.splice(index, 1);
+  }
+
+  async submitDynamic() {
+    if (!this.content) return;
+
+    try {
+      // 1. 创建动态对象
+      const dynamic = new CloudObject("Dynamic");
+      
+      // 2. 上传图片（如果有）
+      const imageUrls = [];
+      for (const img of this.images) {
+        // 这里需要实现图片上传逻辑，返回图片URL
+        // 示例：const uploadedUrl = await this.uploadImage(img.file);
+        // imageUrls.push(uploadedUrl);
+        imageUrls.push(img.url); // 临时使用本地URL，实际应该上传到服务器
+      }
+
+      // 3. 设置动态数据
+      dynamic.set({
+        content: this.content,
+        images: imageUrls,
+        author: this.currentUser.toPointer(),
+        createdAt: new Date(),
+        isPublic: true,
+        likeCount: 0,
+        commentCount: 0,
+        shareCount: 0
+      });
+
+      // 4. 保存动态
+      await dynamic.save();
+
+      // 5. 显示成功提示
+      const alert = await this.alertController.create({
+        header: '发布成功',
+        message: '动态已成功发布',
+        buttons: ['确定']
+      });
+      await alert.present();
+
+      // 6. 返回并刷新动态列表
+      this.navCtrl.navigateBack('/tabs/tab2');
+      
+    } catch (error) {
+      console.error('发布动态失败:', error);
+      const alert = await this.alertController.create({
+        header: '发布失败',
+        message: '动态发布失败，请重试',
+        buttons: ['确定']
+      });
+      await alert.present();
+    }
+  }
+
+  // 实际项目中需要实现图片上传方法
+  private async uploadImage(file: File): Promise<string> {
+    // 这里应该实现图片上传逻辑，返回图片URL
+    // 示例代码：
+    const formData = new FormData();
+    formData.append('file', file);
+    
+    const response = await fetch('http://dev.fmode.cn:1337/parse/files/image.jpg', {
+      method: 'POST',
+      headers: {
+        'X-Parse-Application-Id': 'dev',
+        'X-Parse-Session-Token': this.currentUser.sessionToken
+      },
+      body: formData
+    });
+    
+    const result = await response.json();
+    return result.url;
+  }
+
+}

myapp/src/app/tab2/tab2-routing.module.ts

@@ -14,6 +14,10 @@ const routes: Routes = [
   {
     path: 'dynamic-detail/:id',
     loadChildren: () => import('./dynamic-detail/dynamic-detail.module').then( m => m.DynamicDetailPageModule)
+  },
+  {
+    path: 'dynamic-create',
+    loadChildren: () => import('./dynamic-create/dynamic-create.module').then( m => m.DynamicCreatePageModule)
   }
 ];
 

myapp/src/app/tab2/tab2.page.html

@@ -8,7 +8,7 @@
         
         <!-- 添加右侧按钮 -->
         <ion-buttons slot="end">
-          <ion-button>
+          <ion-button (click)="addDynamic()">
             <ion-icon name="add-circle-outline" slot="icon-only"></ion-icon>
           </ion-button>
         </ion-buttons>
@@ -37,15 +37,10 @@
       <div class="tab-slider" [style.transform]="'translateX(' + (activeTab * 100) + '%)'"></div>
     </div>
   </div>
-  
-  <!-- 加载状态 -->
-  <div *ngIf="isLoading" class="loading-container">
-    <ion-spinner name="crescent"></ion-spinner>
-    <div class="loading-text">加载中...</div>
-  </div>
+   
 
   <!-- 动态日记列表 -->
-  <div class="diary-list" *ngIf="!isLoading && dynamics.length > 0">
+  <div class="diary-list">
 
     <!-- 动态项 -->
     <div class="diary-item" *ngFor="let dynamic of dynamics">

myapp/src/app/tab2/tab2.page.ts

@@ -1,6 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 import { NavController } from '@ionic/angular';
-import { Router } from '@angular/router'; 
+import { ActivatedRoute, Router } from '@angular/router'; 
 import { CloudUser, CloudObject, CloudQuery } from 'src/lib/ncloud';
 import { importTestData } from 'src/lib/import-data';
 import { AlertController } from '@ionic/angular';
@@ -31,9 +31,13 @@ export class Tab2Page implements OnInit {
   constructor(
     private navCtrl:NavController,
     private router: Router,
-    private alertController: AlertController
+    private alertController: AlertController,
+    private activatedRoute: ActivatedRoute
   ) {
     //this.chaXun()
+    this.activatedRoute.params.subscribe(()=>{
+      this.loadData();
+    })
   }
 
   // async chaXun(){
@@ -56,7 +60,9 @@ export class Tab2Page implements OnInit {
     //this.router.navigate(['/dynamic-detail', dynamicId]);
   }
 
-  goToEditdynamic(dynamic?:string){}
+  addDynamic(){
+    this.navCtrl.navigateForward(["tabs","tab2","dynamic-create"])
+  }
 
   async loadData() {
     

myapp/src/app/tab4/tab4.page.html

@@ -16,7 +16,7 @@
                 <div class="user-name">匿名兔ffe</div>
                 <div class="user-id">UID:a15143bcf10c4d...</div>
             </div>
-            <button class="copy-btn">登录</button>
+            <button (click)="goLogin('登录')" class="copy-btn">登录</button>
         </div>
         
         <div class="stats-container">