README.md

@@ -1,4 +1,3 @@
-# 智宿管家项目仓库
+tailor-prod 产品文档
 
-- smarthotel-app 项目代码
-- smarthotel-prod 产品仓库
+tailor-app 前端app项目

package-lock.json

@@ -0,0 +1,6 @@
+{
+  "name": "s202226701017",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {}
+}

smarthotel-app/src/app/app.routes.ts

@@ -1,8 +0,0 @@
-import { Routes } from '@angular/router';
-
-export const routes: Routes = [
-  {
-    path: '',
-    loadChildren: () => import('./tabs/tabs.routes').then((m) => m.routes),
-  },
-];

smarthotel-app/src/app/edit-tag/edit-tag.component.html

@@ -1,3 +0,0 @@
-<p>
-  edit-tag works!
-</p>

smarthotel-app/src/app/edit-tag/edit-tag.component.ts

@@ -1,17 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { IonInput } from '@ionic/angular/standalone';
-
-@Component({
-  selector: 'app-edit-tag',
-  templateUrl: './edit-tag.component.html',
-  styleUrls: ['./edit-tag.component.scss'],
-  imports:[IonInput],
-  standalone: true,
-})
-export class EditTagComponent  implements OnInit {
-
-  constructor() { }
-
-  ngOnInit() {}
-
-}

smarthotel-app/src/app/hotel-picture/hotel-picture.component.html

@@ -1,29 +0,0 @@
-<ion-header [translucent]="true">
-  <ion-toolbar>
-    <ion-title>
-      酒店房间图片生成{{imagineWork?.progress || 0}}
-    </ion-title> 
-  </ion-toolbar>
-</ion-header>
-
-<ion-content [fullscreen]="true">
-  <!-- 生成提示词 -->
-  <ion-textarea [value]="userPrompt" (ionInput)="promptInput($event)" placeholder="房间描述" autoGrow="true"></ion-textarea>
-  <ion-button (click)="createImage()" expand="block">生成图片</ion-button>
-  <!-- 生成结果 -->
-  @if(images.length) {
-    @for(imageUrl of images;track imageUrl){
-      <img [src]="imageUrl" alt="" srcset="">
-    }
-  }
-  <!-- 生成状态 -->
-  @if(!images.length){
-    @if(imagineWork){
-      <h1>生成中</h1>
-    }
-    @if(!imagineWork){
-      <h1>未开始</h1>
-    }
-  }
-
-</ion-content>

smarthotel-app/src/app/hotel-picture/hotel-picture.component.spec.ts

@@ -1,22 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-
-import { HotelPictureComponent } from './hotel-picture.component';
-
-describe('HotelPictureComponent', () => {
-  let component: HotelPictureComponent;
-  let fixture: ComponentFixture<HotelPictureComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      imports: [HotelPictureComponent],
-    }).compileComponents();
-
-    fixture = TestBed.createComponent(HotelPictureComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  }));
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

smarthotel-app/src/app/hotel-picture/hotel-picture.component.ts

@@ -1,67 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { IonHeader, IonToolbar, IonTitle, IonContent } from '@ionic/angular/standalone';
-import { IonTextarea, IonButton } from "@ionic/angular/standalone";
-import { DalleOptions, FmodeChatCompletion, ImagineWork } from 'fmode-ng';
-
-@Component({
-  selector: 'app-hotel-picture',
-  templateUrl: './hotel-picture.component.html',
-  styleUrls: ['./hotel-picture.component.scss'],
-  standalone: true,
-  imports: [
-    IonHeader, IonToolbar, IonTitle, IonContent, 
-    IonButton,
-    IonTextarea
-  ],
-})
-export class HotelPictureComponent implements OnInit {
-
-  userPrompt:string = "宾至如归、古色古香、清静幽雅、桃李周庭、宽敞明亮。"
-  promptInput(ev:any){
-    this.userPrompt = ev.detail.value;
-  }
-  imagineWork:ImagineWork|undefined
-  images:Array<string> = []
-  constructor(){
-    // 示例任务，自己生成图片后请存储新的ID
-    this.imagineWork = new ImagineWork("lpJGiFwWeA");
-    this.imagineWork.fetchTask().then(work=>{
-      this.images = this.imagineWork?.images || [];
-    })
-  }
-
-  PictureDescResult:string = `` // 画面描述结果
-  async createImage(){
-    this.imagineWork = new ImagineWork();
-    let PromptTemple = `您是一名专业的美术画家，请您根据用户描述的房间类型和需求直接写出画面，并且以写实的风格为主。
-    房间描述如下：
-    ${this.userPrompt}
-    `
-    
-    let completion = new FmodeChatCompletion([
-      {role:"system",content:""},
-      {role:"user",content:PromptTemple}
-    ])
-    completion.sendCompletion().subscribe((message:any)=>{
-      // 打印消息体
-      console.log(message.content)
-      // 赋值消息内容给组件内属性
-      this.PictureDescResult = message.content
-      if(message?.complete){
-      let picturePrompt = `${this.PictureDescResult}`//画面描述结果
-      let options:DalleOptions = {prompt:this.userPrompt}
-      this.imagineWork?.draw(options).subscribe(work=>{
-        console.log("imagineWork",work?.toJSON())
-        console.log("images",work?.get("images"))
-        if(work?.get("images")?.length){
-          this.images = work?.get("images");
-        }
-
-      })
-    
-      }
-    })
-  }
-  ngOnInit() {}
-
-}

smarthotel-app/src/app/page-test/page-test.component.html

@@ -1,11 +0,0 @@
-<ion-content>
-  <!-- 文本域：生成提示词 -->
-   <h1>房间的需求</h1>
-  <ion-textarea [value]="userPrompt" (ionInput)="promptInput($event)" placeholder="文本提示词" autoGrow="true"></ion-textarea>
-
-  <!-- 按钮：执行消息生成函数 -->
-  <ion-button (click)="sendMessage()" expand="block">生成房间</ion-button>
-  
-  <!-- 展示：返回消息内容 -->
-  <div>{{responseMsg}}</div>
-</ion-content>

smarthotel-app/src/app/page-test/page-test.component.spec.ts

@@ -1,22 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-
-import { PageTestComponent } from './page-test.component';
-
-describe('PageTestComponent', () => {
-  let component: PageTestComponent;
-  let fixture: ComponentFixture<PageTestComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      imports: [PageTestComponent],
-    }).compileComponents();
-
-    fixture = TestBed.createComponent(PageTestComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  }));
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

smarthotel-app/src/app/page-test/page-test.component.ts

@@ -1,44 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { IonButton, IonContent, IonHeader, IonInput, IonTitle, IonToolbar } from '@ionic/angular/standalone';
-import { IonTextarea } from '@ionic/angular/standalone';
-import { FmodeChatCompletion } from 'fmode-ng';
-
-@Component({
-  selector: 'app-page-test',
-  templateUrl: './page-test.component.html',
-  styleUrls: ['./page-test.component.scss'],
-  standalone: true,
-  imports: [IonHeader, IonToolbar, IonTitle, IonContent, IonButton,
-    IonTextarea,IonInput
-    ],
-})
-export class PageTestComponent  implements OnInit {
-
-  constructor() {}
-  ngOnInit(){}
-  // 用户输入提示词
-   userPrompt:string = "请大致描述您对所居住酒店房间的需求"
-  promptInput(ev:any){
-    this.userPrompt = ev.detail.value;
-  }
-  // 属性：组件内用于展示消息内容的变量
-  responseMsg:any = ""
-  // 方法：实例化completion对象，传入消息数组，并订阅生成的可观察对象。
-  sendMessage(){
-    console.log("create")
-    let PromptTemple = `
-    您作为一名专业的酒店旅馆服务员，请您根据客户描述的房间需求，给出房间的类型和详细的描述。
-    以下是用户的描述：${this.userPrompt}`
-    let completion = new FmodeChatCompletion([
-      {role:"system",content:""},
-      {role:"user",content:PromptTemple}
-    ])
-    completion.sendCompletion().subscribe((message:any)=>{
-      // 打印消息体
-      console.log(message.content)
-      // 赋值消息内容给组件内属性
-      this.responseMsg = message.content
-    })
-  }
-
-}

smarthotel-app/src/app/tab1/tab1.page.html

@@ -1,65 +0,0 @@
-<ion-header>
-  <ion-toolbar>
-    <ion-title>
-      <ion-icon name="home" slot="start"></ion-icon>
-    </ion-title>
-    <ion-searchbar placeholder="输入目的地、酒店名称或需求" slot="start"></ion-searchbar>
-    <ion-avatar slot="end">
-      <ion-img src="smarthotel-prod\img\logo.png" length="2px" wide="2px"></ion-img>
-    </ion-avatar>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content [fullscreen]="true">
-  <div class="welcome-banner">
-    <h2>欢迎来到智宿管家，您的智慧住宿助手！</h2>
-    <ion-button expand="full" color="primary">开始体验</ion-button>
-  </div>
-
-  <div class="function-area">
-    <!-- 订房策略生成 -->
-    <ion-card>
-      <ion-card-header>
-        <ion-card-title>订房策略生成</ion-card-title>
-      </ion-card-header>
-      <ion-card-content>
-        <ion-button expand="full" (click)="goToPage1()">生成订房策略</ion-button>
-      </ion-card-content>
-    </ion-card>
-
-    <!-- 房间图片生成 -->
-    <ion-card>
-      <ion-card-header>
-        <ion-card-title>房间图片生成</ion-card-title>
-      </ion-card-header>
-      <ion-card-content>
-        <ion-button expand="full" (click)="goToPage2()">生成房间图片</ion-button>
-      </ion-card-content>
-    </ion-card>
-  </div>
-
-  <div class="feedback-recommendation">
-    <!-- 用户反馈区域 -->
-    <ion-card>
-      <ion-card-header>
-        <ion-card-title>用户反馈</ion-card-title>
-      </ion-card-header>
-      <ion-card-content>
-        <ion-textarea placeholder="我们希望听到您的声音！请分享您的建议或意见。"></ion-textarea>
-        <ion-button expand="full" color="secondary">提交反馈</ion-button>
-      </ion-card-content>
-    </ion-card>
-
-    <!-- 推荐酒店展示 -->
-    <ion-card>
-      <ion-card-header>
-        <ion-card-title>为您推荐：</ion-card-title>
-      </ion-card-header>
-      <ion-card-content>
-        <h3>海滨酒店</h3>
-        <p>豪华海景房</p>
-        <p>评分：4.8/5</p>
-      </ion-card-content>
-    </ion-card>
-  </div>
-</ion-content>

smarthotel-app/src/app/tab1/tab1.page.ts

@@ -1,45 +0,0 @@
-import { Component } from '@angular/core';
-import { IonHeader, IonToolbar, IonTitle, IonContent } from '@ionic/angular/standalone';
-import { ExploreContainerComponent } from '../explore-container/explore-container.component';
-import { IonAvatar, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonImg, IonInput, IonSearchbar, IonTextarea } from '@ionic/angular/standalone';
-import { IonIcon } from '@ionic/angular/standalone';
-import { Router } from '@angular/router';
-import { CommonModule } from '@angular/common';
-
-
-@Component({
-  selector: 'app-tab1',
-  templateUrl: 'tab1.page.html',
-  styleUrls: ['tab1.page.scss'],
-  standalone: true,
-  imports: [
-    IonHeader, IonToolbar, IonTitle, IonContent, ExploreContainerComponent,
-    IonButton,IonInput,IonImg,IonTextarea,IonAvatar,IonCard,IonCardTitle,
-    IonCardContent,IonCardHeader,IonSearchbar,IonIcon,CommonModule
-  ],
-})
-
-export class Tab1Page {
-  strategyInput: string = '';
-  strategyResult: string = '';
-  roomInput: string = '';
-  roomImage: string | null = null;
-  userFeedback: string = '';
-
-  constructor(private router: Router) {}
-  goToPage1(){
-    this.router.navigate(['/tabs/page-test']);
-  }
-
-  goToPage2(){
-    this.router.navigate(['/tabs/hotel-picture']);
-  }
-
-  // 提交用户反馈的方法
-  submitFeedback() {
-    // 处理用户反馈逻辑
-    console.log('用户反馈:', this.userFeedback);
-    // 清空反馈文本框
-    this.userFeedback = '';
-  }
-}

smarthotel-app/src/app/tab2/tab2.page.html

@@ -1,110 +0,0 @@
-<ion-header>
-  <ion-toolbar>
-    <ion-buttons slot="start">
-      <ion-button (click)="goBack()">
-        <ion-icon name="arrow-back"></ion-icon>
-        <span>返回</span>
-      </ion-button>
-    </ion-buttons>
-    <ion-title>房间管理</ion-title>
-    <ion-buttons slot="end">
-      <ion-button (click)="openProfile()">
-        <ion-icon name="person-circle"></ion-icon>
-      </ion-button>
-    </ion-buttons>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content [fullscreen]="true">
-  <ion-card>
-    <ion-card-header>
-      <ion-card-title>房间状态概览</ion-card-title>
-    </ion-card-header>
-    <ion-card-content>
-      <div>
-        <p>总房间数: {{ totalRooms }}</p>
-        <p>已入住: {{ occupiedRooms }}</p>
-        <p>空房: {{ availableRooms }}</p>
-        <p>待清洁: {{ cleaningRooms }}</p>
-      </div>
-      <ion-img src="path_to_your_chart_image.png"></ion-img> <!-- 替换为实际图表 -->
-    </ion-card-content>
-  </ion-card>
-
-  <ion-list>
-    <ion-item *ngFor="let room of rooms">
-      <ion-label>
-        <h2>房间号: {{ room.number }}</h2>
-        <p>房型: {{ room.type }}</p>
-        <p>当前状态: {{ room.status }}</p>
-      </ion-label>
-      <ion-button (click)="updateRoomStatus(room.number,selectedStatus)">更新状态</ion-button>
-      <ion-button (click)="viewRoomDetails(room.number)">查看详情</ion-button>
-    </ion-item>
-  </ion-list>
-
-  <ion-item>
-    <ion-label>选择房间状态</ion-label>
-    <ion-select [(ngModel)]="selectedStatus">
-      <ion-select-option value="已入住">已入住</ion-select-option>
-      <ion-select-option value="空闲">空闲</ion-select-option>
-      <ion-select-option value="待清洁">待清洁</ion-select-option>
-    </ion-select>
-  </ion-item>
-  
-  <ion-item>
-    <ion-label>选择房间</ion-label>
-    <ion-select [(ngModel)]="selectedRoom">
-      <ion-select-option *ngFor="let room of rooms" [value]="room.number">{{ room.number }}</ion-select-option>
-    </ion-select>
-  </ion-item>
-  
-  <ion-button expand="full" (click)="updateRoomStatus(selectedRoom, selectedStatus)">更新状态</ion-button>
-  <ion-toast [isOpen]="toastOpen" message="{{ toastMessage }}" duration="2000"></ion-toast>
-
-  <ion-modal [isOpen]="isModalOpen" (ionModalDidClose)="closeModal()">
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>房间详情</ion-title>
-        <ion-buttons slot="end">
-          <ion-button (click)="closeModal()">
-            <ion-icon name="close"></ion-icon>
-          </ion-button>
-        </ion-buttons>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content>
-      <ion-card>
-        <ion-card-header>
-          <ion-card-title>房间基本信息</ion-card-title>
-        </ion-card-header>
-        <ion-card-content>
-          <p>房间号: {{ roomDetails.number }}</p>
-          <p>房型: {{ roomDetails.type }}</p>
-          <p>面积: {{ roomDetails.size }}</p>
-          <p>设施: {{ roomDetails.amenities }}</p>
-        </ion-card-content>
-      </ion-card>
-      <ion-card>
-        <ion-card-header>
-          <ion-card-title>入住客人信息</ion-card-title>
-        </ion-card-header>
-        <ion-card-content>
-          <p>姓名: {{ guestInfo.name }}</p>
-          <p>入住时间: {{ guestInfo.checkIn }}</p>
-          <p>退房时间: {{ guestInfo.checkOut }}</p>
-        </ion-card-content>
-      </ion-card>
-      <ion-card>
-        <ion-card-header>
-          <ion-card-title>历史入住记录</ion-card-title>
-        </ion-card-header>
-        <ion-list>
-          <ion-item *ngFor="let record of historyRecords">
-            <p>{{ record.date }} - {{ record.guestName }}</p>
-          </ion-item>
-        </ion-list>
-      </ion-card>
-    </ion-content>
-  </ion-modal>
-</ion-content>

smarthotel-app/src/app/tab2/tab2.page.ts

@@ -1,111 +0,0 @@
-import { Component } from '@angular/core';
-import { IonHeader, IonToolbar, IonTitle, IonContent, IonicRouteStrategy } from '@ionic/angular/standalone';
-import { ExploreContainerComponent } from '../explore-container/explore-container.component';
-import { IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonIcon, IonImg, IonItem, IonLabel, IonList, IonSelect, IonSelectOption, IonToast } from '@ionic/angular/standalone';
-import { IonModal } from '@ionic/angular/standalone';
-import { IonButtons, ToastController } from '@ionic/angular/standalone';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms'; // 导入 FormsModule
-
-
-
-@Component({
-  selector: 'app-tab2',
-  templateUrl: 'tab2.page.html',
-  styleUrls: ['tab2.page.scss'],
-  standalone: true,
-  imports: [
-    IonHeader, IonToolbar, IonTitle, IonContent, ExploreContainerComponent,
-    IonButtons,IonIcon,IonCard,IonCardHeader,IonCardTitle,IonCardContent,
-    IonImg,IonList,IonItem,IonLabel,IonSelect,IonSelectOption,IonModal,IonToast,
-    IonButton,CommonModule,FormsModule, 
-  ]
-})
-export class Tab2Page {
-  totalRooms: number = 50;
-  occupiedRooms: number = 30;
-  availableRooms: number = 15;
-  cleaningRooms: number = 5;
-
-  rooms = [
-    { number: '101', type: '豪华双人间', status: '已入住' },
-    { number: '102', type: '标准单人间', status: '空闲' },
-    { number: '103', type: '豪华双人间', status: '待清洁' },
-    // 更多房间数据...
-  ];
-
-  selectedStatus: string | null = null; // 初始化为 null
-  selectedRoom: string | null = null; // 初始化为 null
-  toastOpen: boolean = false;
-  toastMessage: string = '';
-  isModalOpen: boolean = false; // 控制模态框的打开与关闭
-  roomDetails: any = {}; // 存储房间详情信息
-  guestInfo: any = {}; // 存储入住客人信息
-  historyRecords: any[] = []; // 存储历史入住记录
-
-  constructor(private toastController: ToastController) {}
-
-  goBack() {
-    // 返回上一页的逻辑
-    console.log('返回上一页');
-  }
-
-  openProfile() {
-    // 打开个人资料页的逻辑
-    console.log('打开个人资料页');
-  }
-
-  updateRoomStatus(roomNumber: string | null, status: string | null) {
-    if (roomNumber && status) {
-      const room = this.rooms.find(r => r.number === roomNumber);
-      if (room) {
-        room.status = status;
-        this.showToast('状态更新成功！');
-      } else {
-        this.showToast('状态更新失败，请重试。');
-      }
-    } else {
-      this.showToast('房间号或状态无效。');
-    }
-  }
-
-  viewRoomDetails(roomNumber: string) {
-    // 查找房间详情并打开模态框
-    const room = this.rooms.find(r => r.number === roomNumber);
-    if (room) {
-      this.roomDetails = room;
-      this.guestInfo = { name: '张三', checkIn: '2024年11月25日', checkOut: '2024年11月30日' }; // 示例数据
-      this.historyRecords = [
-        { date: '2024年11月20日 - 2024年11月25日', guestName: '李四' },
-        // 更多历史记录...
-      ];
-      this.isModalOpen = true; // 打开模态框
-    }
-  }
-  
-
-  closeModal() {
-    this.isModalOpen = false; // 关闭模态框
-  }
-
-  async updateStatus() {
-    // 更新状态的逻辑
-    if (this.selectedRoom && this.selectedStatus) {
-      this.updateRoomStatus(this.selectedRoom, this.selectedStatus);
-    } else {
-      this.showToast('请先选择房间和状态。');
-    }
-  }
-
-  async showToast(message: string) {
-    this.toastMessage = message;
-    this.toastOpen = true;
-
-    const toast = await this.toastController.create({
-      message: this.toastMessage,
-      duration: 2000,
-      position: 'bottom',
-    });
-    await toast.present();
-  }
-}

smarthotel-app/src/app/tab3/tab3.page.html

@@ -1,80 +0,0 @@
-<ion-header>
-  <ion-toolbar>
-    <ion-buttons slot="start">
-      <ion-button (click)="goBack()">
-        <ion-icon name="arrow-back"></ion-icon>
-      </ion-button>
-    </ion-buttons>
-    <ion-title>智能客服</ion-title>
-    <ion-buttons slot="end">
-      <ion-button (click)="goToProfile()">
-        <ion-icon name="person-circle"></ion-icon>
-      </ion-button>
-    </ion-buttons>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content [fullscreen]="true">
-  <div class="chat-container">
-    <div class="chat-message" *ngFor="let message of chatMessages">
-      <div class="message" [ngClass]="{'customer': message.sender === 'customer', 'support': message.sender === 'support'}">
-        {{ message.text }}
-      </div>
-    </div>
-    <ion-item>
-      <ion-input placeholder="请输入您的问题或需求" [(ngModel)]="userMessage"></ion-input>
-      <ion-button (click)="sendMessage()">发送</ion-button>
-    </ion-item>
-  </div>
-
-  <ion-card>
-    <ion-card-header>
-      <ion-card-title>常见问题</ion-card-title>
-    </ion-card-header>
-    <ion-list>
-      <ion-item *ngFor="let faq of faqs" (click)="toggleFAQ(faq)">
-        <ion-label>{{ faq.question }}</ion-label>
-        <ion-icon slot="end" [name]="faq.isOpen ? 'chevron-up' : 'chevron-down'"></ion-icon>
-      </ion-item>
-      <ng-container *ngFor="let faq of faqs">
-        <ion-item *ngIf="faq.isOpen">
-          <ion-label>{{ faq.answer }}</ion-label>
-        </ion-item>
-      </ng-container>
-    </ion-list>
-  </ion-card>
-
-  <ion-card>
-    <ion-card-header>
-      <ion-card-title>服务评分</ion-card-title>
-    </ion-card-header>
-    <ion-card-content>
-      <ion-rating [(ngModel)]="userRating" max="5" icon="star"></ion-rating>
-      <ion-item>
-        <ion-input placeholder="请分享您的反馈意见（可选）" [(ngModel)]="userFeedback"></ion-input>
-      </ion-item>
-      <ion-button expand="full" (click)="submitFeedback()">提交评分</ion-button>
-      <div *ngIf="feedbackMessage">{{ feedbackMessage }}</div>
-    </ion-card-content>
-  </ion-card>
-
-  <ion-card>
-    <ion-card-header>
-      <ion-card-title>快捷服务</ion-card-title>
-    </ion-card-header>
-    <ion-card-content>
-      <ion-button expand="full" (click)="checkout()">
-        退房间
-      </ion-button>
-      <ion-button expand="full" (click)="requestCleaning()">
-        请求清洁
-      </ion-button>
-      <ion-button expand="full" (click)="inquireFacilities()">
-        咨询设施
-      </ion-button>
-      <ion-button expand="full" (click)="contactSupport()">
-        联系客服
-      </ion-button>
-    </ion-card-content>
-  </ion-card>
-</ion-content>

smarthotel-app/src/app/tab3/tab3.page.ts

@@ -1,87 +0,0 @@
-import { Component } from '@angular/core';
-import { IonHeader, IonToolbar, IonTitle, IonContent, IonButtons, IonCardContent } from '@ionic/angular/standalone';
-import { ExploreContainerComponent } from '../explore-container/explore-container.component';
-import { IonButton, IonCard, IonCardHeader, IonCardTitle, IonIcon, IonInput, IonItem, IonLabel, IonList, IonRadio } from '@ionic/angular/standalone';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms'; // 导入 FormsModule
-
-interface FAQ {
-  question: string;
-  answer: string;
-  isOpen: boolean;
-}
-
-@Component({
-  selector: 'app-tab3',
-  templateUrl: 'tab3.page.html',
-  styleUrls: ['tab3.page.scss'],
-  standalone: true,
-  imports: [
-    IonHeader, IonToolbar, IonTitle, IonContent, ExploreContainerComponent,
-    IonButton,IonIcon,IonTitle,IonContent,IonItem,IonInput,IonCard,IonCardHeader,
-    IonCardTitle,IonCardHeader,IonList,IonLabel,IonCardTitle,IonButtons,IonCardContent,
-    CommonModule,FormsModule
-  ],
-})
-export class Tab3Page {
-
-  userMessage: string = '';
-  userRating: number = 0;
-  userFeedback: string = '';
-  feedbackMessage: string = '';
-  
-  chatMessages: { sender: string, text: string }[] = [
-    { sender: 'support', text: '欢迎来到智能客服，请问有什么可以帮助您的？' },
-  ];
-
-  faqs: FAQ[] = [
-    { question: '如何预定房间？', answer: '您可以通过我们的应用直接预定，也可以拨打前台电话。', isOpen: false },
-    { question: '酒店提供哪些设施？', answer: '我们提供游泳池、健身房、会议室等设施。', isOpen: false },
-  ];
-
-  goBack() {
-    // Logic to navigate back
-  }
-
-  goToProfile() {
-    // Logic to navigate to user profile
-  }
-
-  sendMessage() {
-    if (this.userMessage.trim()) {
-      this.chatMessages.push({ sender: 'customer', text: this.userMessage });
-      this.userMessage = '';
-      // Simulate a response from support
-      this.chatMessages.push({ sender: 'support', text: '谢谢您的咨询，我们会尽快回复您。' });
-    }
-  }
-
-  toggleFAQ(faq: FAQ) {
-    faq.isOpen = !faq.isOpen;
-  }
-
-  submitFeedback() {
-    if (this.userRating > 0) {
-      this.feedbackMessage = '感谢您的反馈！评分提交成功。';
-      // Logic to handle feedback submission
-    } else {
-      this.feedbackMessage = '请给出评分。';
-    }
-  }
-
-  checkout() {
-    // Logic to check out a room
-  }
-
-  requestCleaning() {
-    // Logic to request cleaning
-  }
-
-  inquireFacilities() {
-    // Logic to inquire about facilities
-  }
-
-  contactSupport() {
-    // Logic to contact support
-  }
-}

smarthotel-app/src/app/tabs/tabs.page.html

@@ -1,18 +0,0 @@
-<ion-tabs>
-  <ion-tab-bar slot="bottom">
-    <ion-tab-button tab="tab1" href="/tabs/tab1">
-      <ion-icon aria-hidden="true" name="tv"></ion-icon>
-      <ion-label>预订</ion-label>
-    </ion-tab-button>
-
-    <ion-tab-button tab="tab2" href="/tabs/tab2">
-      <ion-icon aria-hidden="true" name="chatbox"></ion-icon>
-      <ion-label>信息</ion-label>
-    </ion-tab-button>
-
-    <ion-tab-button tab="tab3" href="/tabs/tab3">
-      <ion-icon aria-hidden="true" name="people"></ion-icon>
-      <ion-label>客户</ion-label>
-    </ion-tab-button>
-  </ion-tab-bar>
-</ion-tabs>

smarthotel-app/src/app/tabs/tabs.page.scss

@@ -1 +0,0 @@
-

smarthotel-app/src/app/tabs/tabs.routes.ts

@@ -1,47 +0,0 @@
-import { Routes } from '@angular/router';
-import { TabsPage } from './tabs.page';
-import { HotelPictureComponent } from '../hotel-picture/hotel-picture.component';
-
-export const routes: Routes = [
-  {
-    path: 'tabs',
-    component: TabsPage,
-    children: [
-      {
-        path: 'tab1',
-        loadComponent: () =>
-          import('../tab1/tab1.page').then((m) => m.Tab1Page),
-      },
-      {
-        path: 'tab2',
-        loadComponent: () =>
-          import('../tab2/tab2.page').then((m) => m.Tab2Page),
-      },
-      {
-        path: 'tab3',
-        loadComponent: () =>
-          import('../tab3/tab3.page').then((m) => m.Tab3Page),
-      },
-      {
-        path: 'page-test',
-        loadComponent: () =>
-          import('../page-test/page-test.component').then((m) => m.PageTestComponent),
-      },
-      {
-        path: 'hotel-picture',
-        loadComponent: () =>
-          import('../hotel-picture/hotel-picture.component').then((m) => HotelPictureComponent),
-      },
-      {
-        path: '',
-        redirectTo: '/tabs/tab1',
-        pathMatch: 'full',
-      },
-    ],
-  },
-  {
-    path: '',
-    redirectTo: '/tabs/tab1',
-    pathMatch: 'full',
-  },
-];

smarthotel-prod/README.md

@@ -1,207 +0,0 @@
-# 项目策划书# 智宿管家项目策划书
-
-
-- 姓名 叶腾
-- 学号 202226701017
-- 班级 22级大数据班
-- 手机 19807921102
-
-## 项目设想
-
-### 01 一句话描述项目设想（行业领域、用户画像、核心功能） 
-- （行业）酒店管理领域，旨在提升酒店运营效率和客户体验。（用户）酒店经营者、管理者，以及对高质量住宿体验有需求的游客。（功能）利用AI智能技术实现酒店管理一体化，包括智能预订、客户服务、房间管理、数据分析等功能。
-
-### 02 项目的业务流程 
-#### 1、用户信息收集：
-用户（酒店管理者）输入酒店基本信息、房间类型、定价策略、客户需求等，系统可通过分析历史运营数据获取相关信息。
-#### 2、需求明确：
-用户提出酒店管理需求，如预订管理、客户服务、房间维护等，以及特殊要求，如节假日促销、客户偏好等。
-#### 3、数据整合与分析：
-系统整合客户信息、市场动态、竞争对手情况等，结合用户输入和需求，利用算法分析最佳管理方案。
-#### 4、方案生成：
-根据分析结果生成酒店管理方案，包括定价策略、促销活动、客户服务流程等。
-#### 5、方案展示与调整：
-向用户展示管理方案，用户可提出修改意见，系统根据反馈快速调整。
-#### 6、预订与提醒：
-用户确认后，系统自动管理相关服务，并在关键节点提醒用户各项准备事宜。
-#### 7、数据分析与反馈：
-定期收集运营数据和客户反馈，用于改进后续管理策略。
-
-### 03 项目的商业模式 
-- 付费订阅模式：用户支付一定的费用，如每月或每年订阅，获取不同等级的酒店管理服务，等级越高，服务越全面。
-- 按次收费模式：针对只偶尔需要管理服务的用户，每次使用服务时支付相应费用。
-- 商家合作分成：与旅游平台、在线旅行社、餐饮服务商等合作，推荐用户消费，从中获取一定比例的分成。
-- 广告收入模式：在系统中展示与酒店相关的优质产品或服务广告，收取广告商费用。
-- 增值服务收费：例如为用户提供市场调研、客户满意度调查等增值服务，并收取额外费用。
-
-### 04 相对可行的策略
-#### 初期策略：
-- 聚焦特定用户群体：先针对中小型酒店、民宿等有较强管理需求的群体，开发符合他们需求的管理解决方案。
-- 提供免费试用与口碑营销：为新用户提供有限次数的免费试用，鼓励他们分享体验，通过口碑吸引更多潜在用户。
-- 与本地旅游平台合作推广：与当地旅游平台合作，展示管理系统的优势，吸引更多酒店加入。
-#### 中期策略：
-- 优化用户体验：根据用户反馈不断改进管理系统，提高系统的智能化和个性化程度。
-- 拓展服务内容：增加如市场分析、客户关系管理等新功能，满足更多用户需求。
-- 推出会员制度：设置不同等级会员，提供如优先服务、更多定制化方案、专属客服等特权，激励用户升级会员。
-#### 长期策略：
-- 跨地区拓展：在本地模式成熟后，将业务拓展到其他城市，与当地酒店建立合作，复制成功经验。
-- 数据驱动发展：深入分析用户数据，挖掘用户潜在需求，开发新的功能和服务，如根据客户反馈自动调整服务内容。
-- 打造酒店管理平台：不仅仅是管理系统，还构建酒店交流、经验分享等功能的平台，增强用户粘性。
-
-## 一、项目背景
-
-### 政策背景
-
-> 用关键字：兴趣、社交，搜索相关的政策和扶持
-
-- 2022年1月12日，《国务院关于印发“十四五”数字经济发展规划的通知》发布，指出数字化服务是提升服务质量的重要途径。
-- 2022年12月14日，中共中央、国务院印发《扩大内需战略规划纲要（2022－2035年）》，提出支持旅游业发展，鼓励酒店行业创新和数字化转型，推动优质服务供给。
-### 行业背景
-
-- 根据《2024-2030年中国酒店行业发展前景预测及投资策略研究报告》，酒店行业正在向智能化、数字化方向发展，市场潜力巨大。
-
-### 市场痛点
-
-- 旅馆管理效率低，传统管理模式难以满足市场需求。
-- 客户体验差，服务人员对客户需求响应不及时。
-- 数据分析能力不足，难以根据市场变化快速调整策略。
-## 二、产品定位
-
-### 用户分析
-
-- 用户（酒店经营者）
-- 中小型酒店
-- 民宿
-- 客户
-- 商务旅行者
-- 休闲游客
-
-### 主要功能
-
-- 智能预订：运用AIGC文本生成，根据用户所描述的需求，帮助用户制定订房策略，同  
-  时运用AIGC图片生成，生成用户描述的相应的房间图片。
-- 客户服务：智能客服系统，快速响应客户需求。
-- 房间管理：实时更新酒店的房间状态。
-
-### 商业模式
-
-- 订阅制收费
-- 按次收费
-- 商家合作分成
-- 广告收入
-
-## 三、可行性测试
-
-### 活动策划
-
-#### 智能预订的提示词相关
-- 用户输入lü'guan信息，系统自动生成预订页面。
-- 根据客户需求，推荐房型和价格。
-#### 客户服务
-- 智能客服系统，24小时在线解答客户疑问。
-- 根据客户反馈，自动调整服务内容。
-#### 数据分析
-- 定期生成运营报告，分析入住率、客户满意度等数据。
-- 提供市场趋势分析，帮助用户调整经营策略。
-
-#### 1. 筛选风险
-
-客户需求变化：根据季节、节假日等因素，及时调整房价和促销活动。
-市场竞争：分析竞争对手的定价策略和促销活动，制定相应的应对措施。
-
-#### 2. 活运营方案选择
-
-结合市场数据，制定合理的定价策略和促销活动，提升客户入住率。
-
-#### 3. 运营流程的策划
-
-- **运营时间**：全年无休，24小时服务。
-
-- 流程设计：
-    客户在线预订
-    系统自动确认
-    客户入住及服务
-    客户反馈收集
-
-#### 4. 客户互动环节
-
-- 提供客户满意度调查，收集客户反馈，持续改进服务。
-
-#### 5. 活动的奖励设计
-
-- **忠诚计划**： 为回头客提供折扣和积分奖励，增加客户粘性。
-- **推荐奖**： 鼓励客户推荐新客户，给予相应的奖励
-
-#### 总结
-
-通过以上策划，项目能够在考虑用户需求和市场变化的基础上，提供一个高效、智能的酒店管理平台，提升酒店运营效率和客户体验。
-
-## 四、产品结构
-
-### 竞品分析
-
-1. 寻找智能旅馆管理的三款App，体验其中核心功能。
-   - 例如：OYO、Airbnb等，参考其管理系统和用户体验。
-2. 寻找数据分析相关App至少1款，体验其数据分析功能。
-   - 例如：Tableau等，参考其数据展示和分析能力。
-
-### 产品结构图
-![](img/1.png)
-#### 产品结构图说明：
-- 用户管理模块：负责用户的注册、登录、角色管理和信息维护，确保用户能够顺利使用系统功能。
-- 预订管理模块：实现房间的查询、预订、订单管理以及取消和修改预订等功能，提升用户预订体验。
-- 客户服务模块：提供智能客服系统，收集客户反馈并解答常见问题，确保客户满意度。
-- 数据分析模块：分析运营数据、客户满意度和市场趋势，帮助酒店管理者制定策略。
-- 营销管理模块：管理促销活动、折扣策略和客户忠诚计划，以提升客户粘性和入住率。
-- 系统管理模块：负责系统的设置、数据备份与恢复以及权限管理，确保系统安全和稳定。
-### 信息结构图
-![](img/2.png)
-#### 信息结构图说明：
-##### 用户管理：
-- 用户ID：唯一标识用户。
-- 用户名：用户的登录名。
-- 密码：用户的账户密码。
-- 角色：用户在系统中的角色（如管理员、普通用户等）。
-- 联系信息：用户的联系方式。
-- 注册时间：用户注册的时间。
-
-##### 预订管理：
-- 预订ID：唯一标识每个预订。
-- 用户ID：与预订相关的用户ID。
-- 房间ID：被预订的房间ID。
-- 预订状态：当前预订的状态（如已确认、已取消等）。
-- 入住日期：客户的入住日期。
-- 离店日期：客户的离店日期。
-- 订单总额：预订的总费用。
-- 创建时间：预订创建的时间。
-
-##### 客户服务：
-- 客户ID：与反馈相关的客户ID。
-- 反馈内容：客户提交的反馈信息。
-- 反馈时间：客户反馈的时间。
-- 处理状态：反馈的处理状态（如已处理、待处理等）。
-- 回复内容：客服对客户反馈的回复。
-
-##### 数据分析：
-- 数据ID：唯一标识每条数据记录。
-- 日期：记录的日期。
-- 客户满意度：通过调查等方式收集的客户满意度评分。
-- 入住率：酒店的入住率统计。
-- 营收分析：酒店的收入分析。
-
-##### 营销管理：
-- 活动ID：唯一标识每个营销活动。
-- 活动名称：营销活动的名称。
-- 活动类型：活动的类型（如折扣、促销等）。
-- 开始时间：活动的开始时间。
-- 结束时间：活动的结束时间。
-- 折扣信息：活动中的折扣信息。
-
-##### 系统管理：
-- 系统设置：系统的基本设置。
-- 数据备份状态：系统数据的备份状态。
-- 用户权限：系统中不同用户的权限设置。
-- 系统日志：记录系统的操作日志。
-- 系统版本：当前系统的版本信息。
-## FAQ：项目起名
-### 智宿管家

smarthotel-app/angular.json → tailor-app/myapp/angular.json

@@ -129,7 +129,7 @@
     "schematicCollections": [
       "@ionic/angular-toolkit"
     ],
-    "analytics": false
+    "analytics": "5fac3f36-027e-4162-83d1-2f5feadd13d1"
   },
   "schematics": {
     "@ionic/angular-toolkit:component": {

smarthotel-app/capacitor.config.ts → tailor-app/myapp/capacitor.config.ts

@@ -2,7 +2,7 @@ import type { CapacitorConfig } from '@capacitor/cli';
 
 const config: CapacitorConfig = {
   appId: 'io.ionic.starter',
-  appName: 'smarthotel-app',
+  appName: 'myapp',
   webDir: 'www'
 };
 

smarthotel-app/ionic.config.json → tailor-app/myapp/ionic.config.json

@@ -1,5 +1,5 @@
 {
-  "name": "smarthotel-app",
+  "name": "myapp",
   "integrations": {
     "capacitor": {}
   },

smarthotel-app/package-lock.json → tailor-app/myapp/package-lock.json

@@ -1,11 +1,11 @@
 {
-  "name": "smarthotel-app",
+  "name": "myapp",
   "version": "0.0.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
-      "name": "smarthotel-app",
+      "name": "myapp",
       "version": "0.0.1",
       "dependencies": {
         "@angular/animations": "^18.0.0",
@@ -22,10 +22,17 @@
         "@capacitor/keyboard": "6.0.3",
         "@capacitor/status-bar": "6.0.2",
         "@ionic/angular": "^8.0.0",
+        "@ionic/vue": "^8.4.0",
+        "@ionic/vue-router": "^8.4.0",
+        "@types/echarts": "^4.9.22",
+        "echarts": "^5.5.1",
         "fmode-ng": "^0.0.62",
         "ionicons": "^7.2.1",
+        "parse": "^5.3.0",
         "rxjs": "~7.8.0",
+        "swiper": "^11.1.15",
         "tslib": "^2.3.0",
+        "vue": "^3.5.13",
         "zone.js": "~0.14.2"
       },
       "devDependencies": {
@@ -1208,7 +1215,6 @@
       "version": "7.25.9",
       "resolved": "https://registry.npmmirror.com/@babel/helper-string-parser/-/helper-string-parser-7.25.9.tgz",
       "integrity": "sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
@@ -1218,7 +1224,6 @@
       "version": "7.25.9",
       "resolved": "https://registry.npmmirror.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.25.9.tgz",
       "integrity": "sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
@@ -1267,7 +1272,6 @@
       "version": "7.26.2",
       "resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.26.2.tgz",
       "integrity": "sha512-DWMCZH9WA4Maitz2q21SRKHo9QXZxkDsbNZoVD62gusNtNBBqDg9i7uOhASfTfIGNzW+O+r7+jAlM8dwphcJKQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/types": "^7.26.0"
@@ -2663,7 +2667,6 @@
       "resolved": "https://registry.npmmirror.com/@babel/runtime-corejs3/-/runtime-corejs3-7.24.7.tgz",
       "integrity": "sha512-eytSX6JLBY6PVAeQa2bFlDx/7Mmln/gaEpsit5a3WEvjGfiIytEsgAwuIXCPM0xvw0v0cJn3ilq0/TvXrW0kgA==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "core-js-pure": "^3.30.2",
         "regenerator-runtime": "^0.14.0"
@@ -2740,7 +2743,6 @@
       "version": "7.26.0",
       "resolved": "https://registry.npmmirror.com/@babel/types/-/types-7.26.0.tgz",
       "integrity": "sha512-Z/yiTPj+lDVnF7lWeKCIJzaIkI0vYO87dMpZ4bg4TDrFe4XXLFWL1TbXU27gBP3QccxV9mZICCrnjnYlJjXHOA==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/helper-string-parser": "^7.25.9",
@@ -2751,9 +2753,9 @@
       }
     },
     "node_modules/@babylonjs/core": {
-      "version": "7.37.0",
-      "resolved": "https://registry.npmmirror.com/@babylonjs/core/-/core-7.37.0.tgz",
-      "integrity": "sha512-BwwZqRr35V9rasMoApBn7TDubulzL9g6+96HhEqYiRQYqJ5arZTEdhanmYgNDy5zem4zF/k4srCi7HmWH212Aw==",
+      "version": "7.35.2",
+      "resolved": "https://registry.npmmirror.com/@babylonjs/core/-/core-7.35.2.tgz",
+      "integrity": "sha512-V15G3ZypYbvMyb4tQfsCSkF8SO/7lXuV44fyqOBJGU1FFcOsnP2JdqJiY6RJpFS6q1//8BH/NYZMEllguvlB8A==",
       "license": "Apache-2.0",
       "peer": true
     },
@@ -4573,6 +4575,25 @@
         "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
       }
     },
+    "node_modules/@ionic/vue": {
+      "version": "8.4.0",
+      "resolved": "https://registry.npmmirror.com/@ionic/vue/-/vue-8.4.0.tgz",
+      "integrity": "sha512-mtSerl9oC21d6xv1q+QuGm61IzJbqpkWbt0lQryXZ3kK1/aVVOnHAN5bX8tPPUN2ALA7CyTWXaCvhxceRV/paA==",
+      "license": "MIT",
+      "dependencies": {
+        "@ionic/core": "8.4.0",
+        "ionicons": "^7.0.0"
+      }
+    },
+    "node_modules/@ionic/vue-router": {
+      "version": "8.4.0",
+      "resolved": "https://registry.npmmirror.com/@ionic/vue-router/-/vue-router-8.4.0.tgz",
+      "integrity": "sha512-g9cLVES3svWnhLbZI4qRTlk2PbbdNB+xAjaMAUGVNZqJRMhIzU3vs4Wiazmd90Bwx39bgr/1o2TPYWzDt1yw0g==",
+      "license": "MIT",
+      "dependencies": {
+        "@ionic/vue": "8.4.0"
+      }
+    },
     "node_modules/@isaacs/cliui": {
       "version": "8.0.2",
       "resolved": "https://registry.npmmirror.com/@isaacs/cliui/-/cliui-8.0.2.tgz",
@@ -4736,7 +4757,6 @@
       "version": "1.5.0",
       "resolved": "https://registry.npmmirror.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
       "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/@jridgewell/trace-mapping": {
@@ -5892,6 +5912,15 @@
         "@types/node": "*"
       }
     },
+    "node_modules/@types/echarts": {
+      "version": "4.9.22",
+      "resolved": "https://registry.npmmirror.com/@types/echarts/-/echarts-4.9.22.tgz",
+      "integrity": "sha512-7Fo6XdWpoi8jxkwP7BARUOM7riq8bMhmsCtSG8gzUcJmFhLo387tihoBYS/y5j7jl3PENT5RxeWZdN9RiwO7HQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/zrender": "*"
+      }
+    },
     "node_modules/@types/estree": {
       "version": "1.0.5",
       "resolved": "https://registry.npmmirror.com/@types/estree/-/estree-1.0.5.tgz",
@@ -6148,6 +6177,12 @@
         "@types/node": "*"
       }
     },
+    "node_modules/@types/zrender": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmmirror.com/@types/zrender/-/zrender-4.0.6.tgz",
+      "integrity": "sha512-1jZ9bJn2BsfmYFPBHtl5o3uV+ILejAtGrDcYSpT4qaVKEI/0YY+arw3XHU04Ebd8Nca3SQ7uNcLaqiL+tTFVMg==",
+      "license": "MIT"
+    },
     "node_modules/@typescript-eslint/eslint-plugin": {
       "version": "6.21.0",
       "resolved": "https://registry.npmmirror.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-6.21.0.tgz",
@@ -6615,6 +6650,134 @@
         "vite": "^3.0.0 || ^4.0.0 || ^5.0.0"
       }
     },
+    "node_modules/@vue/compiler-core": {
+      "version": "3.5.13",
+      "resolved": "https://registry.npmmirror.com/@vue/compiler-core/-/compiler-core-3.5.13.tgz",
+      "integrity": "sha512-oOdAkwqUfW1WqpwSYJce06wvt6HljgY3fGeM9NcVA1HaYOij3mZG9Rkysn0OHuyUAGMbEbARIpsG+LPVlBJ5/Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.25.3",
+        "@vue/shared": "3.5.13",
+        "entities": "^4.5.0",
+        "estree-walker": "^2.0.2",
+        "source-map-js": "^1.2.0"
+      }
+    },
+    "node_modules/@vue/compiler-dom": {
+      "version": "3.5.13",
+      "resolved": "https://registry.npmmirror.com/@vue/compiler-dom/-/compiler-dom-3.5.13.tgz",
+      "integrity": "sha512-ZOJ46sMOKUjO3e94wPdCzQ6P1Lx/vhp2RSvfaab88Ajexs0AHeV0uasYhi99WPaogmBlRHNRuly8xV75cNTMDA==",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/compiler-core": "3.5.13",
+        "@vue/shared": "3.5.13"
+      }
+    },
+    "node_modules/@vue/compiler-sfc": {
+      "version": "3.5.13",
+      "resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.5.13.tgz",
+      "integrity": "sha512-6VdaljMpD82w6c2749Zhf5T9u5uLBWKnVue6XWxprDobftnletJ8+oel7sexFfM3qIxNmVE7LSFGTpv6obNyaQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.25.3",
+        "@vue/compiler-core": "3.5.13",
+        "@vue/compiler-dom": "3.5.13",
+        "@vue/compiler-ssr": "3.5.13",
+        "@vue/shared": "3.5.13",
+        "estree-walker": "^2.0.2",
+        "magic-string": "^0.30.11",
+        "postcss": "^8.4.48",
+        "source-map-js": "^1.2.0"
+      }
+    },
+    "node_modules/@vue/compiler-sfc/node_modules/postcss": {
+      "version": "8.4.49",
+      "resolved": "https://registry.npmmirror.com/postcss/-/postcss-8.4.49.tgz",
+      "integrity": "sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==",
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/postcss"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "nanoid": "^3.3.7",
+        "picocolors": "^1.1.1",
+        "source-map-js": "^1.2.1"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
+      }
+    },
+    "node_modules/@vue/compiler-ssr": {
+      "version": "3.5.13",
+      "resolved": "https://registry.npmmirror.com/@vue/compiler-ssr/-/compiler-ssr-3.5.13.tgz",
+      "integrity": "sha512-wMH6vrYHxQl/IybKJagqbquvxpWCuVYpoUJfCqFZwa/JY1GdATAQ+TgVtgrwwMZ0D07QhA99rs/EAAWfvG6KpA==",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/compiler-dom": "3.5.13",
+        "@vue/shared": "3.5.13"
+      }
+    },
+    "node_modules/@vue/reactivity": {
+      "version": "3.5.13",
+      "resolved": "https://registry.npmmirror.com/@vue/reactivity/-/reactivity-3.5.13.tgz",
+      "integrity": "sha512-NaCwtw8o48B9I6L1zl2p41OHo/2Z4wqYGGIK1Khu5T7yxrn+ATOixn/Udn2m+6kZKB/J7cuT9DbWWhRxqixACg==",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/shared": "3.5.13"
+      }
+    },
+    "node_modules/@vue/runtime-core": {
+      "version": "3.5.13",
+      "resolved": "https://registry.npmmirror.com/@vue/runtime-core/-/runtime-core-3.5.13.tgz",
+      "integrity": "sha512-Fj4YRQ3Az0WTZw1sFe+QDb0aXCerigEpw418pw1HBUKFtnQHWzwojaukAs2X/c9DQz4MQ4bsXTGlcpGxU/RCIw==",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/reactivity": "3.5.13",
+        "@vue/shared": "3.5.13"
+      }
+    },
+    "node_modules/@vue/runtime-dom": {
+      "version": "3.5.13",
+      "resolved": "https://registry.npmmirror.com/@vue/runtime-dom/-/runtime-dom-3.5.13.tgz",
+      "integrity": "sha512-dLaj94s93NYLqjLiyFzVs9X6dWhTdAlEAciC3Moq7gzAc13VJUdCnjjRurNM6uTLFATRHexHCTu/Xp3eW6yoog==",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/reactivity": "3.5.13",
+        "@vue/runtime-core": "3.5.13",
+        "@vue/shared": "3.5.13",
+        "csstype": "^3.1.3"
+      }
+    },
+    "node_modules/@vue/server-renderer": {
+      "version": "3.5.13",
+      "resolved": "https://registry.npmmirror.com/@vue/server-renderer/-/server-renderer-3.5.13.tgz",
+      "integrity": "sha512-wAi4IRJV/2SAW3htkTlB+dHeRmpTiVIK1OGLWV1yeStVSebSQQOwGwIq0D3ZIoBj2C2qpgz5+vX9iEBkTdk5YA==",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/compiler-ssr": "3.5.13",
+        "@vue/shared": "3.5.13"
+      },
+      "peerDependencies": {
+        "vue": "3.5.13"
+      }
+    },
+    "node_modules/@vue/shared": {
+      "version": "3.5.13",
+      "resolved": "https://registry.npmmirror.com/@vue/shared/-/shared-3.5.13.tgz",
+      "integrity": "sha512-/hnE/qP5ZoGpol0a5mDi45bOd7t3tjYJBjsgCsivow7D48cJeV5l05RD82lPqi7gRiphZM37rnhW1l6ZoCNNnQ==",
+      "license": "MIT"
+    },
     "node_modules/@webassemblyjs/ast": {
       "version": "1.14.1",
       "resolved": "https://registry.npmmirror.com/@webassemblyjs/ast/-/ast-1.14.1.tgz",
@@ -7396,9 +7559,9 @@
       }
     },
     "node_modules/babylonjs-gltf2interface": {
-      "version": "7.37.0",
-      "resolved": "https://registry.npmmirror.com/babylonjs-gltf2interface/-/babylonjs-gltf2interface-7.37.0.tgz",
-      "integrity": "sha512-SG6tl3kiI8lkO+XS22RPQMgDJio/7FyCBTN0/C65UP8wUWbFXPIbPb1zUdJBufpCWXsrCgTNad1IWlulQ4iNxw==",
+      "version": "7.35.2",
+      "resolved": "https://registry.npmmirror.com/babylonjs-gltf2interface/-/babylonjs-gltf2interface-7.35.2.tgz",
+      "integrity": "sha512-mJtvjD6+Tjz/bvqoNH23PEOsLMAcxSl44ucZV2Yob8apJUh4UvCneAPREwLCLpu5N959L7ChlwtSU0+NBYbawQ==",
       "license": "Apache-2.0",
       "peer": true
     },
@@ -8433,7 +8596,6 @@
       "integrity": "sha512-7fEcWwKI4rJinnK+wLTezeg2smbFFdSBP6E2kQZNbnzM2s1rpKQ6aaRteZSSg7FLU3P0HGGVo/gbpfanU36urg==",
       "hasInstallScript": true,
       "license": "MIT",
-      "peer": true,
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/core-js"
@@ -8523,8 +8685,7 @@
       "version": "4.2.0",
       "resolved": "https://registry.npmmirror.com/crypto-js/-/crypto-js-4.2.0.tgz",
       "integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/css-loader": {
       "version": "7.1.2",
@@ -8605,6 +8766,12 @@
         "node": ">=4"
       }
     },
+    "node_modules/csstype": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmmirror.com/csstype/-/csstype-3.1.3.tgz",
+      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
+      "license": "MIT"
+    },
     "node_modules/custom-event": {
       "version": "1.0.1",
       "resolved": "https://registry.npmmirror.com/custom-event/-/custom-event-1.0.1.tgz",
@@ -9002,6 +9169,22 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/echarts": {
+      "version": "5.5.1",
+      "resolved": "https://registry.npmmirror.com/echarts/-/echarts-5.5.1.tgz",
+      "integrity": "sha512-Fce8upazaAXUVUVsjgV6mBnGuqgO+JNDlcgF79Dksy4+wgGpQB2lmYoO4TSweFg/mZITdpGHomw/cNBJZj1icA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "tslib": "2.3.0",
+        "zrender": "5.6.0"
+      }
+    },
+    "node_modules/echarts/node_modules/tslib": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz",
+      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
+      "license": "0BSD"
+    },
     "node_modules/ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmmirror.com/ee-first/-/ee-first-1.1.1.tgz",
@@ -9924,6 +10107,12 @@
         "node": ">=4.0"
       }
     },
+    "node_modules/estree-walker": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmmirror.com/estree-walker/-/estree-walker-2.0.2.tgz",
+      "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
+      "license": "MIT"
+    },
     "node_modules/esutils": {
       "version": "2.0.3",
       "resolved": "https://registry.npmmirror.com/esutils/-/esutils-2.0.3.tgz",
@@ -11212,8 +11401,7 @@
       "version": "6.2.1",
       "resolved": "https://registry.npmmirror.com/idb-keyval/-/idb-keyval-6.2.1.tgz",
       "integrity": "sha512-8Sb3veuYCyrZL+VBt9LJfZjLUPWVvqn8tG28VqYNFCo43KHcKuq+b4EiXGeuaLAQWL2YmyDgMp2aSpH9JHsEQg==",
-      "license": "Apache-2.0",
-      "peer": true
+      "license": "Apache-2.0"
     },
     "node_modules/ieee754": {
       "version": "1.2.1",
@@ -12629,9 +12817,9 @@
       }
     },
     "node_modules/langsmith": {
-      "version": "0.2.8",
-      "resolved": "https://registry.npmmirror.com/langsmith/-/langsmith-0.2.8.tgz",
-      "integrity": "sha512-wKVNZoYtd8EqQWUEsfDZlZ77rH7vVqgNtONXRwynUp7ZFMFUIPhSlqE9pXqrmYPE8ZTBFj7diag2lFgUuaOEKw==",
+      "version": "0.2.7",
+      "resolved": "https://registry.npmmirror.com/langsmith/-/langsmith-0.2.7.tgz",
+      "integrity": "sha512-9LFOp30cQ9K/7rzMt4USBI0SEKKhsH4l42ZERBPXOmDXnR5gYpsGFw8SZR0A6YLnc6vvoEmtr/XKel0Odq2UWw==",
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -13216,7 +13404,6 @@
       "version": "0.30.11",
       "resolved": "https://registry.npmmirror.com/magic-string/-/magic-string-0.30.11.tgz",
       "integrity": "sha512-+Wri9p0QHMy+545hKww7YAu5NyzF8iomPL/RQazugQ9+Ez4Ic3mERMd8ZTX5rfK944j+560ZJi8iAwgak1Ac7A==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/sourcemap-codec": "^1.5.0"
@@ -13953,7 +14140,6 @@
       "version": "3.3.7",
       "resolved": "https://registry.npmmirror.com/nanoid/-/nanoid-3.3.7.tgz",
       "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==",
-      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -14899,7 +15085,6 @@
       "resolved": "https://registry.npmmirror.com/parse/-/parse-5.3.0.tgz",
       "integrity": "sha512-mWBnE6hHJhdvlx5KPQcYgCGRdgqKhPw+5fSC0j7vOfse3Lkh3xtDwOfmDpvv2LXZVBj72G/mgVKMRmbAICRzkQ==",
       "license": "Apache-2.0",
-      "peer": true,
       "dependencies": {
         "@babel/runtime-corejs3": "7.24.7",
         "idb-keyval": "6.2.1",
@@ -14974,7 +15159,6 @@
         "https://github.com/sponsors/ctavan"
       ],
       "license": "MIT",
-      "peer": true,
       "bin": {
         "uuid": "dist/bin/uuid"
       }
@@ -15118,7 +15302,6 @@
       "version": "1.1.1",
       "resolved": "https://registry.npmmirror.com/picocolors/-/picocolors-1.1.1.tgz",
       "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
-      "dev": true,
       "license": "ISC"
     },
     "node_modules/picomatch": {
@@ -15856,8 +16039,7 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmmirror.com/react-native-crypto-js/-/react-native-crypto-js-1.0.0.tgz",
       "integrity": "sha512-FNbLuG/HAdapQoybeZSoes1PWdOj0w242gb+e1R0hicf3Gyj/Mf8M9NaED2AnXVOX01b2FXomwUiw1xP1K+8sA==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/readable-stream": {
       "version": "3.6.2",
@@ -16984,7 +17166,6 @@
       "version": "1.2.1",
       "resolved": "https://registry.npmmirror.com/source-map-js/-/source-map-js-1.2.1.tgz",
       "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
-      "dev": true,
       "license": "BSD-3-Clause",
       "engines": {
         "node": ">=0.10.0"
@@ -17438,6 +17619,25 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/swiper": {
+      "version": "11.1.15",
+      "resolved": "https://registry.npmmirror.com/swiper/-/swiper-11.1.15.tgz",
+      "integrity": "sha512-IzWeU34WwC7gbhjKsjkImTuCRf+lRbO6cnxMGs88iVNKDwV+xQpBCJxZ4bNH6gSrIbbyVJ1kuGzo3JTtz//CBw==",
+      "funding": [
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/swiperjs"
+        },
+        {
+          "type": "open_collective",
+          "url": "http://opencollective.com/swiper"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4.7.0"
+      }
+    },
     "node_modules/symbol-observable": {
       "version": "4.0.0",
       "resolved": "https://registry.npmmirror.com/symbol-observable/-/symbol-observable-4.0.0.tgz",
@@ -17945,7 +18145,7 @@
       "version": "5.4.5",
       "resolved": "https://registry.npmmirror.com/typescript/-/typescript-5.4.5.tgz",
       "integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "Apache-2.0",
       "bin": {
         "tsc": "bin/tsc",
@@ -18780,6 +18980,27 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/vue": {
+      "version": "3.5.13",
+      "resolved": "https://registry.npmmirror.com/vue/-/vue-3.5.13.tgz",
+      "integrity": "sha512-wmeiSMxkZCSc+PM2w2VRsOYAZC8GdipNFRTsLSfodVqI9mbejKeXEGr8SckuLnrQPGe3oJN5c3K0vpoU9q/wCQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/compiler-dom": "3.5.13",
+        "@vue/compiler-sfc": "3.5.13",
+        "@vue/runtime-dom": "3.5.13",
+        "@vue/server-renderer": "3.5.13",
+        "@vue/shared": "3.5.13"
+      },
+      "peerDependencies": {
+        "typescript": "*"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/watchpack": {
       "version": "2.4.1",
       "resolved": "https://registry.npmmirror.com/watchpack/-/watchpack-2.4.1.tgz",
@@ -19494,7 +19715,6 @@
       "resolved": "https://registry.npmmirror.com/xmlhttprequest/-/xmlhttprequest-1.8.0.tgz",
       "integrity": "sha512-58Im/U0mlVBLM38NdZjHyhuMtCqa61469k2YP/AaPbvCoV9aQGUpbJBj1QRm2ytRiVQBD/fsw7L2bJGDVQswBA==",
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=0.4.0"
       }
@@ -19639,6 +19859,21 @@
       "resolved": "https://registry.npmmirror.com/zone.js/-/zone.js-0.14.10.tgz",
       "integrity": "sha512-YGAhaO7J5ywOXW6InXNlLmfU194F8lVgu7bRntUF3TiG8Y3nBK0x1UJJuHUP/e8IyihkjCYqhCScpSwnlaSRkQ==",
       "license": "MIT"
+    },
+    "node_modules/zrender": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmmirror.com/zrender/-/zrender-5.6.0.tgz",
+      "integrity": "sha512-uzgraf4njmmHAbEUxMJ8Oxg+P3fT04O+9p7gY+wJRVxo8Ge+KmYv0WJev945EH4wFuc4OY2NLXz46FZrWS9xJg==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "tslib": "2.3.0"
+      }
+    },
+    "node_modules/zrender/node_modules/tslib": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz",
+      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
+      "license": "0BSD"
     }
   }
 }

smarthotel-app/package.json → tailor-app/myapp/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "smarthotel-app",
+  "name": "myapp",
   "version": "0.0.1",
   "author": "Ionic Framework",
   "homepage": "https://ionicframework.com/",
@@ -27,10 +27,17 @@
     "@capacitor/keyboard": "6.0.3",
     "@capacitor/status-bar": "6.0.2",
     "@ionic/angular": "^8.0.0",
+    "@ionic/vue": "^8.4.0",
+    "@ionic/vue-router": "^8.4.0",
+    "@types/echarts": "^4.9.22",
+    "echarts": "^5.5.1",
     "fmode-ng": "^0.0.62",
     "ionicons": "^7.2.1",
+    "parse": "^5.3.0",
     "rxjs": "~7.8.0",
+    "swiper": "^11.1.15",
     "tslib": "^2.3.0",
+    "vue": "^3.5.13",
     "zone.js": "~0.14.2"
   },
   "devDependencies": {

tailor-app/myapp/src/app/app.routes.ts

@@ -0,0 +1,28 @@
+import { Routes } from '@angular/router';
+
+export const routes: Routes = [
+  {
+    path: '',
+    loadChildren: () => import('./tabs/tabs.routes').then((m) => m.routes),
+  },
+  {
+    path: 'customization',
+    loadComponent: () => import('./customization/customization.page').then( m => m.CustomizationPage)
+  },
+  {
+    path: 'community',
+    loadComponent: () => import('./community/community.page').then( m => m.CommunityPage)
+  },
+  {
+    path: 'yiyun',
+    loadComponent: () => import('./yiyun/yiyun.page').then( m => m.YiyunPage)
+  },
+  {
+    path: 'store',
+    loadComponent: () => import('./store/store.page').then( m => m.StorePage)
+  },
+  {
+    path: 'me',
+    loadComponent: () => import('./me/me.page').then( m => m.MePage)
+  },
+];

tailor-app/myapp/src/app/community/community.page.html

@@ -0,0 +1,4 @@
+
+<ion-content>
+  <div class="echarts" id="chart"></div>
+</ion-content>

tailor-app/myapp/src/app/community/community.page.scss

@@ -0,0 +1,5 @@
+.echarts{
+    width: 340px;
+    height: 200px;
+    margin: 0 auto;
+}

tailor-app/myapp/src/app/community/community.page.spec.ts

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

tailor-app/myapp/src/app/community/community.page.ts

@@ -0,0 +1,97 @@
+
+import { Component, NgModule, OnInit } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { addIcons } from 'ionicons';
+import { camera,trendingUpOutline,sparklesOutline,cloudyOutline,diceOutline} from 'ionicons/icons';
+import { IonContent, IonHeader, IonTitle, IonToolbar, IonButton, IonLabel, IonItem, IonList, IonBackButton, IonButtons, IonIcon, IonItemDivider, IonAvatar, IonThumbnail, IonItemOptions, IonItemOption, IonItemSliding, IonInput, IonCheckbox, IonRadio, IonToggle, IonRadioGroup, IonSearchbar,IonSegment,IonSegmentButton,IonDatetime,IonFooter,IonCardContent,IonCardTitle,IonCardHeader,IonCard,IonCol,IonRow,IonGrid,IonChip,IonTabButton,IonListHeader,ItemReorderEventDetail, IonTabBar, IonTabs,IonCardSubtitle,IonImg,IonBadge   } from '@ionic/angular/standalone';
+addIcons({camera,trendingUpOutline,sparklesOutline,cloudyOutline,diceOutline})
+
+import * as echarts from 'echarts';
+@Component({
+  selector: 'app-community',
+  templateUrl: './community.page.html',
+  styleUrls: ['./community.page.scss'],
+  standalone: true,
+  imports: [IonContent, IonHeader, IonTitle, IonToolbar, CommonModule, FormsModule, IonButton,  IonLabel, IonLabel, IonList, IonItem, IonBackButton, IonButtons, IonIcon, IonItemDivider, IonAvatar, IonThumbnail, IonItemOptions, IonItemSliding, IonItemOption, IonItemOptions,IonInput,IonCheckbox,IonRadio,IonToggle,IonRadioGroup,IonSearchbar,IonSegment,IonSegmentButton,IonDatetime,IonFooter,IonCardContent,IonCardTitle,IonCardHeader,IonCard,IonCol,IonRow,IonGrid,IonChip,IonTabButton,IonTabBar,IonTabs,IonListHeader,IonCardSubtitle,IonImg,IonBadge ]
+
+})
+
+
+export class CommunityPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+    
+    this.initEchart();
+  }
+  public chart: any;
+  initEchart() {
+    let ec = echarts as any;
+    let container = document.getElementById('chart');
+    this.chart = ec.init(container);
+    let option = {
+      tooltip: {
+        trigger: 'axis'
+      },
+      legend: {
+        data: ['邮件营销', '联盟广告', '视频广告', '直接访问', '搜索引擎']
+      },
+      grid: {
+        left: "2%",
+        right: "3%",
+        bottom: "1%",
+        borderWidth:10,
+        containLabel: true
+      },
+      toolbox: {
+        feature: {
+          saveAsImage: {}
+        }
+      },
+      xAxis: {
+        type: 'category',
+        boundaryGap: false,
+        data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
+      },
+      yAxis: {
+        type: 'value'
+      },
+      series: [
+        {
+          name: '邮件营销',
+          type: 'line',
+          stack: '总量',
+          data: [120, 132, 101, 134, 90, 230, 210]
+        },
+        {
+          name: '联盟广告',
+          type: 'line',
+          stack: '总量',
+          data: [220, 182, 191, 234, 290, 330, 310]
+        },
+        {
+          name: '视频广告',
+          type: 'line',
+          stack: '总量',
+          data: [150, 232, 201, 154, 190, 330, 410]
+        },
+        {
+          name: '直接访问',
+          type: 'line',
+          stack: '总量',
+          data: [320, 332, 301, 334, 390, 330, 320]
+        },
+        {
+          name: '搜索引擎',
+          type: 'line',
+          stack: '总量',
+          data: [820, 932, 901, 934, 1290, 1330, 1320]
+        }
+      ]
+    };
+ 
+    this.chart.setOption(option);
+}}
+

tailor-app/myapp/src/app/customization/customization.page.html

@@ -0,0 +1,58 @@
+<ion-header [translucent]="true">
+  <ion-toolbar>
+    <ion-title>customization</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+  
+  
+
+
+    <ion-list >
+      <ion-item  >
+        <app-edit-tag (onTagChange)="setTags($event)"></app-edit-tag>
+      </ion-item>
+
+      <ion-item  >
+        <ion-textarea (ionInput)="onInputarea($event)" label="服装描述" placeholder="请尽可能描述衣服需要的功能" [autoGrow]="true"></ion-textarea>
+      </ion-item>
+
+    </ion-list>    
+    <!-- <h1>父级页面传参</h1>
+    @for(tag of editTags;track tag;){
+      <p>{{tag}}</p>
+    } -->
+    <!-- GPT组件 -->
+    <!-- <h1>GPT组件</h1>
+     <ion-input type="" [(ngModel)]="inputValue"  ></ion-input> -->
+    <ion-button (click)="printInputValue()">提交</ion-button>
+    @if(!isComplete){
+      <div>{{gptre}}</div>
+    }
+   
+   @if(isComplete){
+    <fm-markdown-preview class="content-style" [content]="gptre" ></fm-markdown-preview>
+   }
+
+
+   <ion-title>服装生成{{imagineWork?.progress || 0}}</ion-title>
+   <!-- <ion-textarea [value]="userPrompt" (ionInput)="promptInput($event)" placeholder="服装填写" autoGrow="true"></ion-textarea> -->
+  <ion-button (click)="createImage()" expand="block">生成图片</ion-button>
+  <!-- 生成结果 -->
+  @if(images.length) {
+    @for(imageUrl of images;track imageUrl){
+      <img [src]="imageUrl" alt="" srcset="">
+    }
+  }
+  <!-- 生成状态 -->
+  @if(!images.length){
+    @if(imagineWork){
+      <h1>生成中</h1>
+    }
+    @if(!imagineWork){
+      <h1>未开始</h1>
+    }
+  }
+  {{   picdetail}}
+</ion-content>

tailor-app/myapp/src/app/customization/customization.page.spec.ts

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

tailor-app/myapp/src/app/customization/customization.page.ts

@@ -0,0 +1,189 @@
+import { Component, OnInit } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { IonContent, IonHeader, IonTitle, IonToolbar, IonButton, IonInput, IonTextarea, IonItem, IonList } from '@ionic/angular/standalone';
+import { TestChatCompletion } from './test-chat-completion';
+import { EditTagComponent } from '../edit-tag/edit-tag.component';
+import { FmodeChatCompletion, MarkdownPreviewModule } from 'fmode-ng';
+import { DalleOptions, ImagineWork } from 'fmode-ng';
+@Component({
+  selector: 'app-customization',
+  templateUrl: './customization.page.html',
+  styleUrls: ['./customization.page.scss'],
+  standalone: true,
+  imports: [IonContent, IonHeader, IonTitle, IonToolbar, CommonModule, FormsModule, IonButton, IonInput, EditTagComponent, IonTextarea, IonItem, IonList, MarkdownPreviewModule,]
+})
+export class CustomizationPage implements OnInit {
+  public isComplete: boolean = false;
+  public inputValue = ""
+  public gptre = ""
+  area: string = ""
+  editTags: Array<string> = []
+  onInput(event: any) {
+    console.log(event.detail.value);
+
+  }
+  setTags(ev: any) {
+    console.log(ev);
+    this.editTags = ev
+  }
+  onInputarea(event: any) {
+    this.area = event.detail.value;
+    console.log(this.area);
+
+  }
+  ngOnInit() {
+  }
+
+
+  async printInputValue() {
+    console.log("create")
+    let promt = `您作为一名专业的服装推荐师，请帮我推荐具体的某件衣服,不要鞋子裤子，帽子，我只要你推荐某个具体服装，风格是：${this.editTags.join(",")},需要的衣服功能是：${this.area}`
+    let completion = new FmodeChatCompletion([
+      { role: "system", content: "" },
+      { role: "user", content: promt }
+    ])
+    completion.sendCompletion().subscribe((message: any) => {
+      // 打印消息体
+      console.log(message.content)
+      // 赋值消息内容给组件内属性
+      this.gptre = message.content
+      if (message?.complete) {
+        this.isComplete = true
+      }
+    })
+
+
+
+
+
+
+
+
+    // console.log("开始解析");
+    // console.log(this.inputValue);
+
+    // let token = "r:16cd8f27084ff647fcdb5308a6783c4c"
+    // localStorage.setItem("token",token)
+    // let promt=`您作为一名专业的服装推荐师，请帮我推荐具体的某件衣服，风格是：${this.editTags.join(",")},需要的衣服功能是：${this.area}`
+    // let messageList: any = [
+    //   {
+    //     role: "system", content: `${new Date().toLocaleString}`
+    //   },
+    //   {
+    //     role: "user", content: promt
+    //   }
+    // ]
+
+    // let completion=new TestChatCompletion(messageList)
+    // completion.createCompletionByStream()
+    // setInterval(()=>{
+    //   console.log(messageList);
+    //   if(messageList.length!=1){
+    //     this.gptre=messageList[messageList.length-1].content
+
+    //   }
+    // },2000)
+
+
+    // let bodyJson = {
+    //   "token": `Bearer ${token}`,
+    //   "messages": messageList,
+    //   "model": "fmode-4.5-128k",
+    //   "temperature": 0.5,
+    //   "presence_penalty": 0,
+    //   "frequency_penalty": 0,
+    //   "top_p": 1,
+    //   "stream": true
+    // };
+
+    // let response = await fetch("https://test.fmode.cn/api/apig/aigc/gpt/v1/chat/completions", {
+    //   "headers": {
+    //     "accept": "text/event-stream",
+    //   },
+    //   "body": JSON.stringify(bodyJson),
+    //   "method": "POST",
+    //   "mode": "cors",
+    //   "credentials": "omit"
+    // });
+    // let reader = response.body?.getReader()
+    // if (!reader) {
+    //   throw new Error("Failed to get the response reader.");
+    // }
+
+    // let decoder = new TextDecoder();
+    // let buffer = "";
+
+    // while (true) {
+    //   let { done, value } = await reader.read();
+    //   if (done) {
+    //     break;
+    //   }
+    //   let data = decoder.decode(value);
+    //   let messages = data.split("\n");
+    //   console.log(messages);
+
+    //   for (let i = 0; i < messages.length - 1; i++) {
+    //     let message = messages[i];
+    //     console.log(message);
+    //     let dataStr: string = message.split("data: ")[1]
+    //     if (dataStr && dataStr.startsWith("{")) {
+    //       try {
+    //         let json = JSON.parse(dataStr);
+    //         let content = json.choices[0].delta.content
+    //         this.gptre = this.gptre + content
+    //       } catch (err) { }
+    //     }
+
+
+    //   }
+    // }
+
+
+  }
+
+  userPrompt: string = ""
+  promptInput(ev: any) {
+    this.userPrompt = ev.detail.value;
+  }
+  imagineWork: ImagineWork | undefined
+  images: Array<string> = []
+  constructor(
+  ) {
+    // 示例任务，自己生成图片后请存储新的ID
+    console.log('ImagineWork instance:', this.imagineWork);
+    this.imagineWork = new ImagineWork("EXOVSbrmMK");
+    this.imagineWork.fetchTask().then(work => {
+      this.images = this.imagineWork?.images || [];
+    })
+  }
+  picdetail: string = ""
+  async createImage() {
+    let promotTemplate = `您是一名专业的美术画家，请您根据服装描述内容，将其描述的服装细节描述出来,服装描述如下：${this.gptre}`
+    let completion = new FmodeChatCompletion([
+      { role: "system", content: "" },
+      { role: "user", content: promotTemplate }
+    ])
+
+    completion.sendCompletion().subscribe((message: any) => {
+      // 打印消息体
+      console.log(message.content)
+      // 赋值消息内容给组件内属性
+      this.picdetail = message.content
+      if (message?.complete) {
+        this.imagineWork = new ImagineWork();
+        let options: DalleOptions = { prompt: this.picdetail }
+        this.imagineWork.draw(options).subscribe(work => {
+          console.log("imagineWork", work?.toJSON())
+          console.log("images", work?.get("images"))
+          if (work?.get("images")?.length) {
+            this.images = work?.get("images");
+          }
+        })
+      }
+    })
+
+
+
+  }
+}

tailor-app/myapp/src/app/customization/test-chat-completion.ts

@@ -0,0 +1,99 @@
+export interface TestChatMessage{
+    role:string
+    content:string
+}
+export class TestChatCompletion{
+messageList:Array<TestChatMessage>
+constructor(messageList:Array<TestChatMessage>){
+    this.messageList = messageList
+}
+async createCompletionByStream() {
+
+let token = localStorage.getItem("token");
+let bodyJson = {
+  "token": `Bearer ${token}`,
+  "messages": this.messageList,
+  "model": "fmode-4.5-128k",
+  "temperature": 0.5,
+  "presence_penalty": 0,
+  "frequency_penalty": 0,
+  "top_p": 1,
+  "stream":true
+};
+
+let response = await fetch("https://test.fmode.cn/api/apig/aigc/gpt/v1/chat/completions", {
+  "headers": {
+    "accept": "text/event-stream",
+    "sec-fetch-dest": "empty",
+    "sec-fetch-mode": "cors",
+    "sec-fetch-site": "same-site"
+  },
+  "referrer": "https://ai.fmode.cn/",
+  "referrerPolicy": "strict-origin-when-cross-origin",
+  "body": JSON.stringify(bodyJson),
+  "method": "POST",
+  "mode": "cors",
+  "credentials": "omit"
+});
+
+let messageAiReply = ""
+let messageIndex = this.messageList.length
+let reader = response.body?.getReader();
+if (!reader) {
+  throw new Error("Failed to get the response reader.");
+}
+
+let decoder = new TextDecoder();
+let buffer = "";
+
+while (true) {
+  let { done, value } = await reader.read();
+  if (done) {
+    break;
+  }
+
+  buffer += decoder.decode(value);
+
+  // Split the buffer by newlines to get individual messages
+  let messages = buffer.split("\n");
+
+  // Process each message
+  for (let i = 0; i < messages.length - 1; i++) {
+    let message = messages[i];
+
+    // Process the message as needed
+    /**
+     * data: {"id":"chatcmpl-y2PLKqPDnwAFJIj2L5aqdH5TWK9Yv","object":"chat.completion.chunk","created":1696770162,"model":"fmode-4.5-128k","choices":[{"index":0,"delta":{"role":"assistant","content":""},"finish_reason":null}]}
+     * data: {"id":"chatcmpl-y2PLKqPDnwAFJIj2L5aqdH5TWK9Yv","object":"chat.completion.chunk","created":1696770162,"model":"fmode-4.5-128k","choices":[{"index":0,"delta":{},"finish_reason":"stop"}]}
+     * data: [DONE]
+     */
+    let dataText = message.replace("data:\ ","")
+    if(dataText.startsWith("{")){
+      try{
+        let dataJson = JSON.parse(dataText)
+        console.log(dataJson)
+        messageAiReply += dataJson?.choices?.[0]?.delta?.content || ""
+        this.messageList[messageIndex] = {
+          role:"assistant",
+          content:messageAiReply
+        }
+      }catch(err){}
+    }
+    if(dataText.startsWith("[")){
+      console.log(message)
+      console.log("完成")
+      this.messageList[messageIndex] = {
+        role:"assistant",
+        content:messageAiReply
+      }
+      messageAiReply = ""
+    }
+    // Parse the message as JSON
+    // let data = JSON.parse(message);
+
+    // Clear the processed message from the buffer
+    buffer = buffer.slice(message.length + 1);
+  }
+}
+}
+}

tailor-app/myapp/src/app/edit-tag/edit-tag.component.html

@@ -0,0 +1,11 @@
+
+
+  
+  
+    <ion-input [value]="userInputText" (ionInput)="onInput($event)" type="" ></ion-input>
+    <!-- <p>当前输入{{userInputText}}</p> -->
+    <ion-button (click)="addtag()">添加标签</ion-button>
+    @for(tag of tags;track tag;){
+      <ion-chip>{{tag}} <span (click)="deleteTag(tag)">x</span></ion-chip>
+    }
+    

smarthotel-app/src/app/edit-tag/edit-tag.component.spec.ts → tailor-app/myapp/src/app/edit-tag/edit-tag.component.spec.ts

@@ -1,4 +1,5 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
 
 import { EditTagComponent } from './edit-tag.component';
 
@@ -8,7 +9,8 @@ describe('EditTagComponent', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      imports: [EditTagComponent],
+      declarations: [ EditTagComponent ],
+      imports: [IonicModule.forRoot()]
     }).compileComponents();
 
     fixture = TestBed.createComponent(EditTagComponent);

tailor-app/myapp/src/app/edit-tag/edit-tag.component.ts

@@ -0,0 +1,43 @@
+import { Component, EventEmitter, OnInit, Output } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { IonContent, IonHeader, IonTitle, IonToolbar, IonButton, IonInput, IonChip, IonItem, IonList } from '@ionic/angular/standalone';
+
+@Component({
+  selector: 'app-edit-tag',
+  templateUrl: './edit-tag.component.html',
+  styleUrls: ['./edit-tag.component.scss'],
+  standalone: true,
+  imports: [IonContent, IonHeader, IonTitle, IonToolbar, CommonModule, FormsModule,IonButton,IonInput,IonChip,IonItem,IonList]
+
+})
+export class EditTagComponent  implements OnInit {
+  public inputValue = ""
+  public gptre = ""
+  tags:Array<string>=[]
+
+  userInputText:string=""
+  onInput(event:any){
+  this.userInputText=  event.detail.value
+    
+  }
+  deleteTag(tag:string){
+    let idx=this.tags.findIndex(item=>item==tag)
+    this.tags.splice(idx,1)
+
+  }
+  addtag(){
+    this.tags.push(this.userInputText);
+    this.userInputText=""
+    this.onTagChange.emit(this.tags)
+  }
+  @Output()
+  onTagChange:EventEmitter<Array<string>>=new EventEmitter<Array<string>>()
+  constructor() { }
+
+  ngOnInit() {
+  }
+  
+
+  
+}

tailor-app/myapp/src/app/me/me.page.html

@@ -0,0 +1,239 @@
+<ion-header [translucent]="true">
+  <ion-toolbar color="success">
+    <ion-title>me</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+
+    <!-- GPT组件 -->
+    <h1>GPT组件</h1>
+     <ion-input type="" [(ngModel)]="inputValue"  ></ion-input>
+    <ion-button (click)="printInputValue()">提交</ion-button>
+   {{gptre}}
+
+
+  <h1>页面跳转和组件使用</h1>
+  <!-- 页面跳转和组件使用 -->
+  <ion-button [routerLink]="[ '/yiyun' ]">
+    跳转到yiyun
+  </ion-button>
+
+  <app-slide></app-slide>
+  <h1>button组件调用</h1>
+  <!-- button组件调用 -->
+  <ion-button [routerLink]="[ '/yiyun' ]" color="warning">
+    修改按钮颜色
+  </ion-button>
+ 
+  <ion-buttons slot="start">
+    <ion-back-button>返回i按钮</ion-back-button>
+  </ion-buttons>
+
+  <ion-button expand="block">
+    按钮可以block
+  </ion-button>
+
+  <ion-button expand="full">
+    按钮可以直角
+  </ion-button>
+
+  <ion-button fill="clear" expand="block">
+    按钮可以透明背景填充
+  </ion-button>
+
+  <ion-button>
+    <ion-icon slot="icon-only" name="add"></ion-icon>
+  </ion-button>
+  <ion-button fill="clear">
+    <ion-icon slot="icon-only" name="add"></ion-icon>
+  </ion-button>
+
+  <ion-button size="small">
+    小按钮
+  </ion-button>
+  <ion-button size="large">
+    大按钮
+  </ion-button>
+
+  <ion-button mode="ios" color="primary">
+    ios按钮
+  </ion-button>
+  <ion-button mode="md" color="primary">
+    android按钮
+  </ion-button>
+
+  <ion-button>
+    <ion-icon name="add" slot="start"></ion-icon>
+    图片在左侧文字在右侧按钮
+  </ion-button>
+  <ion-button>
+    <ion-icon name="add" slot="end"></ion-icon>
+    图片在右侧文字在右侧按钮
+  </ion-button>
+
+  <!-- List组件调用 -->
+  <h1>List组件调用 </h1>
+  <ion-list lines="full">
+    <ion-item *ngFor="let item of list" [routerLink]="[ '/yiyun' ]">
+      {{item}}
+    </ion-item>
+  </ion-list>
+
+  <ion-list>
+    <ion-item-divider>
+      <ion-label>分组列表A</ion-label>
+    </ion-item-divider>
+    <ion-item>
+      a
+    </ion-item>
+    <ion-item>
+      aaa
+    </ion-item>
+
+    <ion-item-divider>
+      <ion-label>B</ion-label>
+    </ion-item-divider>
+    <ion-item>
+      b
+    </ion-item>
+    <ion-item>
+      bbb
+    </ion-item>
+  </ion-list>
+
+  <ion-list lines="full">
+    <ion-item *ngFor="let item of list">
+      <ion-icon slot="start" name="add"></ion-icon>
+      带图标列表{{item}}
+    </ion-item>
+  </ion-list>
+
+  <ion-list>
+    <ion-item *ngFor="let item of list">
+      <ion-avatar item-left>
+        <img src="assets/shapes.svg">
+      </ion-avatar>
+      <ion-label>列表中的头像</ion-label>
+    </ion-item>
+  </ion-list>
+
+  <ion-list>
+    <ion-item *ngFor="let item of list">
+      <ion-thumbnail item-left>
+        <img src="assets/shapes.svg">
+      </ion-thumbnail>
+      <div>
+        <h2>我是标题</h2>
+        <p>我是新闻</p>
+      </div>
+      <button ion-button clear item-right></button>
+    </ion-item>
+  </ion-list>
+
+  <ion-list>
+    <ion-item-sliding>
+      <ion-item>
+        <ion-label>滑动列表1</ion-label>
+      </ion-item>
+      <ion-item-options side="start">
+        <ion-item-option>Favorite</ion-item-option>
+        <ion-item-option color="primary">Share</ion-item-option>
+      </ion-item-options>
+
+      <ion-item-options side="end">
+        <ion-item-option>Unread</ion-item-option>
+      </ion-item-options>
+    </ion-item-sliding>
+
+    <ion-item-sliding>
+      <ion-item>
+        <ion-label>滑动列表2</ion-label>
+      </ion-item>
+      <ion-item-options side="start">
+        <ion-item-option>Favorite</ion-item-option>
+        <ion-item-option color="primary">Share</ion-item-option>
+      </ion-item-options>
+
+      <ion-item-options side="end">
+        <ion-item-option>Unread</ion-item-option>
+      </ion-item-options>
+    </ion-item-sliding>
+  </ion-list>
+  <!-- 表单组件 -->
+  <h1>表单组件</h1>
+
+  <ion-list>
+    <ion-item>
+      <ion-label>用户名</ion-label>
+      <ion-input [(ngModel)]="peopleInfo.username"></ion-input>
+    </ion-item>
+
+    <ion-item>
+      <ion-label>是否本科</ion-label>
+      <ion-toggle slot="end" [(ngModel)]="peopleInfo.flag"></ion-toggle>
+    </ion-item>
+
+    <ion-radio-group [(ngModel)]="peopleInfo.payType">
+      <ion-item>
+        <ion-avatar item-left>
+          <img src="assets/shapes.svg">
+        </ion-avatar>
+        <ion-label>支付宝支付</ion-label>
+        <ion-radio value="1"></ion-radio>
+      </ion-item>
+
+      <ion-item>
+        <ion-avatar item-left>
+          <img src="assets/shapes.svg">
+        </ion-avatar>
+        <ion-label>微信支付</ion-label>
+        <ion-radio value="2"></ion-radio>
+      </ion-item>
+
+    </ion-radio-group>
+
+    <ion-item>
+      <ion-label>checkbox</ion-label>
+      <ion-checkbox></ion-checkbox>
+    </ion-item>
+  </ion-list>
+  {{peopleInfo|json}}
+
+  <!-- 搜索框 -->
+  <h1>搜索框</h1>
+  <ion-searchbar animated="true" placeholder="Animated"></ion-searchbar>
+  <ion-searchbar placeholder="Filter Pizza" (ionInput)="onSearchInput($event)" animated></ion-searchbar>
+
+  <!-- segment演示 -->
+  <h1>segment演示</h1>
+  <ion-segment [(ngModel)]="tab">
+    <ion-segment-button value="tab1">
+      <ion-label>详情</ion-label>
+    </ion-segment-button>
+    <ion-segment-button value="tab2">
+      <ion-label>评论</ion-label>
+    </ion-segment-button>
+
+    <div class="info" [ngSwitch]="tab">
+      <div *ngSwitchCase="'tab1'">商品简介</div>
+      <div *ngSwitchCase="'tab2'">商品评论</div>
+
+    </div>
+
+
+    {{tab}}
+
+    <!-- 日期组件 -->
+    <h1>日期组件</h1>
+    <ion-list>
+
+      <ion-item>
+        <ion-label>Date</ion-label>
+        <ion-datetime display-format="DD.MM.YYYY HH:mm"></ion-datetime>
+      </ion-item>
+    </ion-list>
+  </ion-segment>
+
+
+</ion-content>

smarthotel-app/src/app/tab2/tab2.page.spec.ts → tailor-app/myapp/src/app/me/me.page.spec.ts

@@ -1,13 +1,12 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { MePage } from './me.page';
 
-import { Tab2Page } from './tab2.page';
+describe('MePage', () => {
+  let component: MePage;
+  let fixture: ComponentFixture<MePage>;
 
-describe('Tab2Page', () => {
-  let component: Tab2Page;
-  let fixture: ComponentFixture<Tab2Page>;
-
-  beforeEach(async () => {
-    fixture = TestBed.createComponent(Tab2Page);
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MePage);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });

tailor-app/myapp/src/app/me/me.page.ts

@@ -0,0 +1,124 @@
+import { Component, OnInit } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { IonContent, IonHeader, IonTitle, IonToolbar, IonButton, IonLabel, IonItem, IonList, IonBackButton, IonButtons, IonIcon, IonItemDivider, IonAvatar, IonThumbnail, IonItemOptions, IonItemOption, IonItemSliding, IonInput, IonCheckbox, IonRadio, IonToggle, IonRadioGroup, IonSearchbar, IonSegment, IonSegmentButton, IonDatetime } from '@ionic/angular/standalone';
+import { RouterModule } from '@angular/router';
+import { SlideModule } from '../module/slide/slide.module';
+import { addIcons } from 'ionicons';
+import { add } from 'ionicons/icons';
+// import {FmodeChatCompletion} from "fmode-ng"
+import { TestChatCompletion } from './test-chat-completion';
+
+addIcons({ add })
+@Component({
+  selector: 'app-me',
+  templateUrl: './me.page.html',
+  styleUrls: ['./me.page.scss'],
+  standalone: true,
+  imports: [IonContent, IonHeader, IonTitle, IonToolbar, CommonModule, FormsModule, IonButton, RouterModule, IonLabel, IonLabel, IonList, IonItem, SlideModule, IonBackButton, IonButtons, IonIcon, IonItemDivider, IonAvatar, IonThumbnail, IonItemOptions, IonItemSliding, IonItemOption, IonItemOptions, IonInput, IonCheckbox, IonRadio, IonToggle, IonRadioGroup, IonSearchbar, IonSegment, IonSegmentButton, IonDatetime]
+})
+export class MePage implements OnInit {
+  public list: any = []
+  public tab = "tab1"
+  constructor() { }
+  public inputValue = ""
+  public gptre = ""
+  public peopleInfo: any = {
+    username: '',
+    age: 20,
+    flag: true,
+    payType: '1',
+    checkBoxList: [
+      { val: '吃饭', ischecked: true },
+      { val: '睡觉', ischecked: false },
+      { val: '敲代码', ischecked: false }
+    ],
+    cityList: ['北京', '上海', '深圳'],
+    city: '北京'
+  }
+  ngOnInit() {
+    for (var i = 0; i < 5; i++) {
+      this.list.push(`aaaaaaa${i}`);
+    }
+  }
+  onSearchInput(event: any) {
+    console.log(event.target.value);
+  }
+  async printInputValue() {
+    console.log("开始解析");
+
+    let token = "r:16cd8f27084ff647fcdb5308a6783c4c"
+    localStorage.setItem("token",token)
+    let messageList: any = [
+      {
+        role: "system", content: `${new Date().toLocaleString}`
+      },
+      {
+        role: "user", content: this.inputValue
+      }
+    ]
+
+    let completion=new TestChatCompletion(messageList)
+    completion.createCompletionByStream()
+    setInterval(()=>{
+      console.log(messageList);
+      this.gptre=messageList[messageList.length-1].content
+    },1000)
+
+
+    // let bodyJson = {
+    //   "token": `Bearer ${token}`,
+    //   "messages": messageList,
+    //   "model": "fmode-4.5-128k",
+    //   "temperature": 0.5,
+    //   "presence_penalty": 0,
+    //   "frequency_penalty": 0,
+    //   "top_p": 1,
+    //   "stream": true
+    // };
+
+    // let response = await fetch("https://test.fmode.cn/api/apig/aigc/gpt/v1/chat/completions", {
+    //   "headers": {
+    //     "accept": "text/event-stream",
+    //   },
+    //   "body": JSON.stringify(bodyJson),
+    //   "method": "POST",
+    //   "mode": "cors",
+    //   "credentials": "omit"
+    // });
+    // let reader = response.body?.getReader()
+    // if (!reader) {
+    //   throw new Error("Failed to get the response reader.");
+    // }
+
+    // let decoder = new TextDecoder();
+    // let buffer = "";
+
+    // while (true) {
+    //   let { done, value } = await reader.read();
+    //   if (done) {
+    //     break;
+    //   }
+    //   let data = decoder.decode(value);
+    //   let messages = data.split("\n");
+    //   console.log(messages);
+
+    //   for (let i = 0; i < messages.length - 1; i++) {
+    //     let message = messages[i];
+    //     console.log(message);
+    //     let dataStr: string = message.split("data: ")[1]
+    //     if (dataStr && dataStr.startsWith("{")) {
+    //       try {
+    //         let json = JSON.parse(dataStr);
+    //         let content = json.choices[0].delta.content
+    //         this.gptre = this.gptre + content
+    //       } catch (err) { }
+    //     }
+
+
+    //   }
+    // }
+
+
+  }
+}

tailor-app/myapp/src/app/me/test-chat-completion.ts

@@ -0,0 +1,99 @@
+export interface TestChatMessage{
+    role:string
+    content:string
+}
+export class TestChatCompletion{
+messageList:Array<TestChatMessage>
+constructor(messageList:Array<TestChatMessage>){
+    this.messageList = messageList
+}
+async createCompletionByStream() {
+
+let token = localStorage.getItem("token");
+let bodyJson = {
+  "token": `Bearer ${token}`,
+  "messages": this.messageList,
+  "model": "fmode-4.5-128k",
+  "temperature": 0.5,
+  "presence_penalty": 0,
+  "frequency_penalty": 0,
+  "top_p": 1,
+  "stream":true
+};
+
+let response = await fetch("https://test.fmode.cn/api/apig/aigc/gpt/v1/chat/completions", {
+  "headers": {
+    "accept": "text/event-stream",
+    "sec-fetch-dest": "empty",
+    "sec-fetch-mode": "cors",
+    "sec-fetch-site": "same-site"
+  },
+  "referrer": "https://ai.fmode.cn/",
+  "referrerPolicy": "strict-origin-when-cross-origin",
+  "body": JSON.stringify(bodyJson),
+  "method": "POST",
+  "mode": "cors",
+  "credentials": "omit"
+});
+
+let messageAiReply = ""
+let messageIndex = this.messageList.length
+let reader = response.body?.getReader();
+if (!reader) {
+  throw new Error("Failed to get the response reader.");
+}
+
+let decoder = new TextDecoder();
+let buffer = "";
+
+while (true) {
+  let { done, value } = await reader.read();
+  if (done) {
+    break;
+  }
+
+  buffer += decoder.decode(value);
+
+  // Split the buffer by newlines to get individual messages
+  let messages = buffer.split("\n");
+
+  // Process each message
+  for (let i = 0; i < messages.length - 1; i++) {
+    let message = messages[i];
+
+    // Process the message as needed
+    /**
+     * data: {"id":"chatcmpl-y2PLKqPDnwAFJIj2L5aqdH5TWK9Yv","object":"chat.completion.chunk","created":1696770162,"model":"fmode-4.5-128k","choices":[{"index":0,"delta":{"role":"assistant","content":""},"finish_reason":null}]}
+     * data: {"id":"chatcmpl-y2PLKqPDnwAFJIj2L5aqdH5TWK9Yv","object":"chat.completion.chunk","created":1696770162,"model":"fmode-4.5-128k","choices":[{"index":0,"delta":{},"finish_reason":"stop"}]}
+     * data: [DONE]
+     */
+    let dataText = message.replace("data:\ ","")
+    if(dataText.startsWith("{")){
+      try{
+        let dataJson = JSON.parse(dataText)
+        console.log(dataJson)
+        messageAiReply += dataJson?.choices?.[0]?.delta?.content || ""
+        this.messageList[messageIndex] = {
+          role:"assistant",
+          content:messageAiReply
+        }
+      }catch(err){}
+    }
+    if(dataText.startsWith("[")){
+      console.log(message)
+      console.log("完成")
+      this.messageList[messageIndex] = {
+        role:"assistant",
+        content:messageAiReply
+      }
+      messageAiReply = ""
+    }
+    // Parse the message as JSON
+    // let data = JSON.parse(message);
+
+    // Clear the processed message from the buffer
+    buffer = buffer.slice(message.length + 1);
+  }
+}
+}
+}

tailor-app/myapp/src/app/module/slide/slide.component.html

@@ -0,0 +1,3 @@
+<p>
+  slide works!
+</p>

tailor-app/myapp/src/app/module/slide/slide.component.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { SlideComponent } from './slide.component';
+
+describe('SlideComponent', () => {
+  let component: SlideComponent;
+  let fixture: ComponentFixture<SlideComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ SlideComponent ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(SlideComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

tailor-app/myapp/src/app/module/slide/slide.component.ts

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

tailor-app/myapp/src/app/module/slide/slide.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { SlideComponent } from './slide.component';
+
+
+@NgModule({
+  declarations: [SlideComponent],
+  imports: [
+    CommonModule,
+  ],
+  exports:[SlideComponent]
+})
+export class SlideModule { }

tailor-app/myapp/src/app/store/store.page.html

@@ -0,0 +1,32 @@
+
+<ion-content>
+  <ion-card style="width: 90%;margin: auto;margin-top: 10px;margin-bottom: 10px;">
+    <ion-card-header>
+      <ion-card-title>各类服装年销售量渐变堆叠面积图</ion-card-title>
+    </ion-card-header>
+    <ion-card-content>
+      <p>5年内服装销售量</p>
+      <p>随时间或其他变量的变化趋势和相对大小</p>
+     
+
+<ion-button style="border-color: yellow;" expand="block" (click)="shengcheng1()"><ion-icon name="podium-outline" style="margin-right: 5px;"></ion-icon> VIP一键生成</ion-button>
+    </ion-card-content>
+  </ion-card>
+  @if(visable1){
+    <ion-progress-bar [buffer]="buffer" [value]="progress"></ion-progress-bar>
+  }
+  @if(!visable1){
+    <ion-list style="width: 100%;margin: auto;margin-top: 20px;">
+      <ion-item>
+        <h1 style="font-weight: bolder;">2017-2023 各类服装年销售量渐变堆叠面积图</h1>
+      </ion-item>
+      <ion-item class="noPadding">
+        <div class="echarts " id="chart" ></div>
+  
+          
+      </ion-item>
+    </ion-list>
+  }
+  
+  
+</ion-content>

tailor-app/myapp/src/app/store/store.page.scss

@@ -0,0 +1,38 @@
+.echarts{
+    width: 380px;
+    height: 200px;
+    margin: 0 auto;
+}
+.item-native{
+    margin: 0;
+    padding: 0;
+}
+.noPadding{
+    --padding-start:0
+    --inner-padding-end:0
+}
+ion-button {
+    --background: #000;
+    --background-hover: #9ce0be;
+    --background-activated: #88f4be;
+    --background-focused: #88f4be;
+  
+    --color: #ecc422;
+  
+    --border-radius: 0;
+    --border-color: #000;
+    --border-style: solid;
+    --border-width: 1px;
+  
+    --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);
+  
+    --ripple-color: deeppink;
+  
+    --padding-top: 10px;
+    --padding-bottom: 10px;
+  }
+
+  ion-progress-bar {
+    --background: #f3e895;
+    --progress-background: #f7ef18;;
+  }

smarthotel-app/src/app/tab1/tab1.page.spec.ts → tailor-app/myapp/src/app/store/store.page.spec.ts

@@ -1,13 +1,12 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { StorePage } from './store.page';
 
-import { Tab1Page } from './tab1.page';
+describe('StorePage', () => {
+  let component: StorePage;
+  let fixture: ComponentFixture<StorePage>;
 
-describe('Tab1Page', () => {
-  let component: Tab1Page;
-  let fixture: ComponentFixture<Tab1Page>;
-
-  beforeEach(async () => {
-    fixture = TestBed.createComponent(Tab1Page);
+  beforeEach(() => {
+    fixture = TestBed.createComponent(StorePage);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });

tailor-app/myapp/src/app/store/store.page.ts

@@ -0,0 +1,242 @@
+import { Component, OnInit } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { IonContent, IonHeader, IonTitle, IonToolbar, IonButton, IonLabel, IonItem, IonList, IonBackButton, IonButtons, IonIcon, IonItemDivider, IonAvatar, IonThumbnail, IonItemOptions, IonItemOption, IonItemSliding, IonInput, IonCheckbox, IonRadio, IonToggle, IonRadioGroup, IonSearchbar,IonSegment,IonSegmentButton,IonDatetime,IonFooter,IonCardContent,IonCardTitle,IonCardHeader,IonCard,IonCol,IonRow,IonGrid,IonChip,IonImg,IonProgressBar } from '@ionic/angular/standalone';
+import * as echarts from 'echarts';
+import { podiumOutline} from 'ionicons/icons';
+import { addIcons } from 'ionicons';
+addIcons({podiumOutline})
+// <ion-icon name="podium-outline"></ion-icon>
+// <ion-icon name="bar-chart-outline"></ion-icon>
+// <ion-icon name="cellular-outline"></ion-icon>
+@Component({
+  selector: 'app-store',
+  templateUrl: './store.page.html',
+  styleUrls: ['./store.page.scss'],
+  standalone: true,
+  imports: [IonContent, IonHeader, IonTitle, IonToolbar, CommonModule, FormsModule, IonButton,  IonLabel, IonLabel, IonList, IonItem, IonBackButton, IonButtons, IonIcon, IonItemDivider, IonAvatar, IonThumbnail, IonItemOptions, IonItemSliding, IonItemOption, IonItemOptions,IonInput,IonCheckbox,IonRadio,IonToggle,IonRadioGroup,IonSearchbar,IonSegment,IonSegmentButton,IonDatetime,IonFooter,IonCardContent,IonCardTitle,IonCardHeader,IonCard,IonCol,IonRow,IonGrid,IonChip,IonImg,IonProgressBar ]
+})
+export class StorePage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+    
+    
+  }
+  //进度条
+  public buffer = 0.06;
+  public progress = 0;
+  public visable1:boolean=true
+
+ shengcheng1(){
+    setInterval(() => {
+      this.buffer += 0.4;
+      this.progress += 0.4;
+
+      // Reset the progress bar when it reaches 100%
+      // to continuously show the demo
+      if (this.progress > 1) {
+        setTimeout(() => {
+          this.buffer = 0.06;
+          this.progress = 0;
+          this.visable1=false
+          this.initEchart();
+        }, 1000);
+      }
+    }, 1000);
+    
+  }
+  public chart: any;
+  initEchart() {
+    let ec = echarts as any;
+    let container = document.getElementById('chart');
+    this.chart = ec.init(container);
+    let option = {
+      color: ['#80FFA5', '#00DDFF', '#37A2FF', '#FF0087', '#FFBF00'],
+      title: {
+        text: ''
+      },
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          type: 'cross',
+          label: {
+            backgroundColor: '#6a7985'
+          }
+        }
+      },
+      legend: {
+        data: ['风衣', '羽绒服', 'T恤', '牛仔裤', '连衣裙']
+      },
+      toolbox: {
+        feature: {
+          saveAsImage: {}
+        }
+      },
+      grid: {
+        left: '3%',
+        right: '4%',
+        bottom: '3%',
+        containLabel: true
+      },
+      xAxis: [
+        {
+          type: 'category',
+          boundaryGap: false,
+           data: ['2017', '2018', '2019', '2020', '2021', '2022', '2023']
+        }
+      ],
+      yAxis: [
+        {
+          type: 'value'
+        }
+      ],
+      series: [
+        {
+          name: '风衣',
+          type: 'line',
+          stack: 'Total',
+          smooth: true,
+          lineStyle: {
+            width: 0
+          },
+          showSymbol: false,
+          areaStyle: {
+            opacity: 0.8,
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: 'rgb(128, 255, 165)'
+              },
+              {
+                offset: 1,
+                color: 'rgb(1, 191, 236)'
+              }
+            ])
+          },
+          emphasis: {
+            focus: 'series'
+          },
+          data: [140, 232, 101, 264, 90, 340, 250]
+        },
+        {
+          name: '羽绒服',
+          type: 'line',
+          stack: 'Total',
+          smooth: true,
+          lineStyle: {
+            width: 0
+          },
+          showSymbol: false,
+          areaStyle: {
+            opacity: 0.8,
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: 'rgb(0, 221, 255)'
+              },
+              {
+                offset: 1,
+                color: 'rgb(77, 119, 255)'
+              }
+            ])
+          },
+          emphasis: {
+            focus: 'series'
+          },
+          data: [120, 282, 111, 234, 220, 340, 310]
+        },
+        {
+          name: 'T恤',
+          type: 'line',
+          stack: 'Total',
+          smooth: true,
+          lineStyle: {
+            width: 0
+          },
+          showSymbol: false,
+          areaStyle: {
+            opacity: 0.8,
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: 'rgb(55, 162, 255)'
+              },
+              {
+                offset: 1,
+                color: 'rgb(116, 21, 219)'
+              }
+            ])
+          },
+          emphasis: {
+            focus: 'series'
+          },
+          data: [320, 132, 201, 334, 190, 130, 220]
+        },
+        {
+          name: '牛仔裤',
+          type: 'line',
+          stack: 'Total',
+          smooth: true,
+          lineStyle: {
+            width: 0
+          },
+          showSymbol: false,
+          areaStyle: {
+            opacity: 0.8,
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: 'rgb(255, 0, 135)'
+              },
+              {
+                offset: 1,
+                color: 'rgb(135, 0, 157)'
+              }
+            ])
+          },
+          emphasis: {
+            focus: 'series'
+          },
+          data: [220, 402, 231, 134, 190, 230, 120]
+        },
+        {
+          name: '连衣裙',
+          type: 'line',
+          stack: 'Total',
+          smooth: true,
+          lineStyle: {
+            width: 0
+          },
+          showSymbol: false,
+          label: {
+            show: true,
+            position: 'top'
+          },
+          areaStyle: {
+            opacity: 0.8,
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: 'rgb(255, 191, 0)'
+              },
+              {
+                offset: 1,
+                color: 'rgb(224, 62, 76)'
+              }
+            ])
+          },
+          emphasis: {
+            focus: 'series'
+          },
+          data: [220, 302, 181, 234, 210, 290, 150]
+        }
+      ]
+    };
+    
+    
+ 
+    this.chart.setOption(option);
+}
+}

tailor-app/myapp/src/app/tabs/tabs.page.html

@@ -0,0 +1,26 @@
+<ion-tabs style="background-color: aqua;">
+  <ion-tab-bar slot="bottom">
+    <ion-tab-button tab="customization" href="/tabs/customization">
+      <ion-icon name="color-palette-outline"></ion-icon>
+      <ion-label>定制</ion-label>
+    </ion-tab-button>
+
+    <ion-tab-button tab="community" href="/tabs/community">
+      <ion-icon name="chatbubbles-outline"></ion-icon>
+      <ion-label>社区</ion-label>
+    </ion-tab-button>
+
+    <ion-tab-button tab="yiyun" href="/tabs/yiyun">
+      <ion-icon name="cut-outline"></ion-icon>
+      <ion-label>衣韵</ion-label>
+    </ion-tab-button>
+    <ion-tab-button tab="store" href="/tabs/store">
+      <ion-icon name="storefront-outline"></ion-icon>
+      <ion-label>商家</ion-label>
+    </ion-tab-button>
+    <ion-tab-button tab="me" href="/tabs/me">
+      <ion-icon name="person-circle-outline"></ion-icon>
+      <ion-label>我的</ion-label>
+    </ion-tab-button>
+  </ion-tab-bar>
+</ion-tabs>

tailor-app/myapp/src/app/tabs/tabs.page.scss

@@ -0,0 +1,4 @@
+
+.tabbar {
+    background-color: #5c2626 !important; // 使用!important可以确保样式被优先应用
+  }

smarthotel-app/src/app/tabs/tabs.page.ts → tailor-app/myapp/src/app/tabs/tabs.page.ts

@@ -1,7 +1,7 @@
 import { Component, EnvironmentInjector, inject } from '@angular/core';
 import { IonTabs, IonTabBar, IonTabButton, IonIcon, IonLabel } from '@ionic/angular/standalone';
 import { addIcons } from 'ionicons';
-import { tv, chatbox, people } from 'ionicons/icons';
+import { colorPaletteOutline,chatbubblesOutline,cutOutline,storefrontOutline,personCircleOutline } from 'ionicons/icons';
 
 @Component({
   selector: 'app-tabs',
@@ -14,6 +14,6 @@ export class TabsPage {
   public environmentInjector = inject(EnvironmentInjector);
 
   constructor() {
-    addIcons({ tv, chatbox, people });
+    addIcons({ colorPaletteOutline,chatbubblesOutline,cutOutline,storefrontOutline,personCircleOutline});
   }
 }

tailor-app/myapp/src/app/tabs/tabs.routes.ts

@@ -0,0 +1,46 @@
+import { Routes } from '@angular/router';
+import { TabsPage } from './tabs.page';
+
+export const routes: Routes = [
+  {
+    path: 'tabs',
+    component: TabsPage,
+    children: [
+      {
+        path: 'community',
+        loadComponent: () =>
+          import('../community/community.page').then((m) => m.CommunityPage),
+      },
+      {
+        path: 'customization',
+        loadComponent: () =>
+          import('../customization/customization.page').then((m) => m.CustomizationPage),
+      },
+      {
+        path: 'me',
+        loadComponent: () =>
+          import('../me/me.page').then((m) => m.MePage),
+      },
+      {
+        path: 'store',
+        loadComponent: () =>
+          import('../store/store.page').then((m) => m.StorePage),
+      },
+      {
+        path: 'yiyun',
+        loadComponent: () =>
+          import('../yiyun/yiyun.page').then((m) => m.YiyunPage),
+      },
+      {
+        path: '',
+        redirectTo: '/tabs/yiyun',
+        pathMatch: 'full',
+      },
+    ],
+  },
+  {
+    path: '',
+    redirectTo: '/tabs/yiyun',
+    pathMatch: 'full',
+  },
+];

tailor-app/myapp/src/app/yiyun/yiyun.page.html

@@ -0,0 +1,174 @@
+<!-- 页面顶部导航栏 -->
+<ion-header class="ion-no-border" style="background-color: rgb(231, 244, 247);;">
+  <ion-toolbar style="background-color: rgb(231, 244, 247);;">
+    <ion-searchbar animated="true" placeholder="Animated"></ion-searchbar>
+    <ion-buttons slot="end">
+      <!-- <ion-button size="small">登录/注册</ion-button> -->
+      <!-- <ion-button size="small">商家后台入口</ion-button> -->
+    </ion-buttons>
+  </ion-toolbar>
+</ion-header>
+
+<!-- 品牌展示区 -->
+<ion-content>
+  <!-- <ion-slides>
+      <ion-slide>
+        <img src="最新服装定制案例图片路径" alt="服装定制案例">
+      </ion-slide>
+      <ion-slide>
+        <img src="时尚活动照片路径" alt="时尚活动">
+      </ion-slide>
+    </ion-slides> -->
+  <ion-grid>
+    <ion-row>
+      <ion-col *ngFor="let item of items; let i = index" class="custom-padding">
+        <div class="button-container">
+          <ion-icon size="large" [name]="item.image"></ion-icon>
+          <p class="item-text" style="font-weight: bolder;">{{ item.text }}</p>
+        </div>
+      </ion-col>
+    </ion-row>
+  </ion-grid>
+
+  <ion-grid style="justify-content: center;display: flex;">
+    <ion-row style="background-color: white;width: 90%;border-radius: 10px;">
+      <ion-card style="width: 44%;box-shadow: none;">
+        <ion-card-header>
+          <img src="assets/img/ding.png" alt="">
+          <ion-card-title style="font-size: 17px;font-weight:bolder;">定制服务</ion-card-title>
+        </ion-card-header>
+        <!-- <ion-card-content>
+            <ion-button expand="block">点击参与最新定制活动</ion-button>
+          </ion-card-content> -->
+      </ion-card>
+
+      <!-- 用户定制入口 -->
+      <ion-card style="width: 44%;box-shadow: none;">
+        <ion-card-header>
+          <img src="assets/img/3d.png" alt="">
+          <ion-card-title style="font-size: 17px;font-weight:bolder;">3D试衣服务</ion-card-title>
+        </ion-card-header>
+
+      </ion-card>
+    </ion-row>
+  </ion-grid>
+
+
+
+  <!-- 特色服务展示 -->
+  <!-- <ion-grid>
+      <ion-row>
+        <ion-col size="6">
+          <ion-card>
+            <ion-icon name="camera"></ion-icon> 假设AI定制对应的ion-icon名称为ai-outline，需替换准确图标名
+            <ion-card-header>
+              <ion-card-title>AI智能推荐，精准匹配</ion-card-title>
+            </ion-card-header>
+          </ion-card>
+        </ion-col>
+        <ion-col size="6">
+          <ion-card>
+            <ion-icon name="camera"></ion-icon> 假设虚拟试衣对应的ion-icon名称为body-outline，需替换准确图标名
+            <ion-card-header>
+              <ion-card-title>虚拟试衣体验，先试后买</ion-card-title>
+            </ion-card-header>
+          </ion-card>
+        </ion-col>
+      </ion-row>
+    </ion-grid> -->
+
+  <!-- 用户评价和案例展示 -->
+
+  <ion-list style="width: 90%;margin: auto;margin-top: 20px;">
+    <ion-item>
+      <h1 style="font-weight: bolder;">用户评价和案例展示</h1>
+    </ion-item>
+    <ion-item>
+
+      <ion-label>
+        <ion-grid>
+          <ion-row>
+            <ion-col size="auto">
+
+            </ion-col>
+            <ion-col width-10>
+              <ion-avatar
+                style="width: 30px;height: 30px;display: inline-block;vertical-align: middle;margin-right: 10px;">
+                <img src="assets/shapes.svg" alt="用户头像">
+              </ion-avatar>
+              <h2 style="font-weight: bolder;display: inline-block;">小林</h2>
+              <div style="margin-top: 10px;margin-bottom: 10px;">
+                衣服非常合身，面料舒适，非常满意！这件服装简直是时尚与艺术的完美融合，让人一眼难忘！从设计到剪裁，每一个细节都透露着匠人的精湛技艺与独到眼光。面料质感丝滑，穿着舒适亲肤，色彩搭配既经典又不失前卫感，完美衬托出穿着者的独特气质。
+              </div>
+            </ion-col>
+          </ion-row>
+          <ion-row>
+            <img src="assets/img/shi.png" alt="定制案例">
+
+          </ion-row>
+        </ion-grid>
+      </ion-label>
+    </ion-item>
+  </ion-list>
+
+  <!-- 商家管理入口 -->
+  <ion-card style="width: 90%;margin: auto;margin-bottom: 10px;margin-top: 10px;">
+    <ion-card-content>
+
+      <ion-button expand="block"><ion-icon name="camera"></ion-icon> 一键入库</ion-button>
+      <p>智能库存管理，让生意更简单</p>
+    </ion-card-content>
+  </ion-card>
+
+  <ion-list style="width: 90%;margin: auto;margin-top: 20px;">
+    <ion-item>
+      <h1 style="font-weight: bolder;">AI智能推荐</h1>
+    </ion-item>
+    <ion-item>
+
+
+        <ion-grid fixed style="width: 100%;">
+          <ion-row>
+            <ion-col size="6" *ngFor="let product of products" [attr.data-order]="product.order">
+              <ion-card>
+                <ion-img [src]="product.image"></ion-img>
+                <ion-card-header>
+                  <ion-card-title>{{ product.name }}</ion-card-title>
+                </ion-card-header>
+                <ion-card-content>
+                  <p>{{ product.description }}</p>
+                  <ion-button fill="clear">{{ product.price | currency }}</ion-button>
+                </ion-card-content>
+              </ion-card>
+            </ion-col>
+          </ion-row>
+        </ion-grid>
+    </ion-item>
+  </ion-list>
+
+
+
+  <!-- 最新时尚资讯 -->
+  <ion-card style="width: 90%;margin: auto;margin-top: 10px;margin-bottom: 10px;">
+    <ion-card-header>
+      <ion-card-title>2024年春季流行趋势</ion-card-title>
+    </ion-card-header>
+    <ion-card-content>
+      <p>本季流行色、面料及搭配建议一览</p>
+      <ion-button expand="block">了解更多</ion-button>
+    </ion-card-content>
+  </ion-card>
+
+  <!-- 页面底部 -->
+  <!-- <ion-footer>
+      <ion-toolbar>
+        <ion-label>© 2024 个性化定制服装平台</ion-label>
+        <ion-buttons slot="end">
+          <ion-button>客服热线：400-xxx-xxxx</ion-button>
+          <ion-button>关于我们</ion-button>
+          <ion-button>合作伙伴</ion-button>
+          <ion-button>隐私政策</ion-button>
+        </ion-buttons>
+      </ion-toolbar>
+    </ion-footer> -->
+</ion-content>

tailor-app/myapp/src/app/yiyun/yiyun.page.scss

@@ -0,0 +1,77 @@
+ion-searchbar {
+    --background: #ffffff; // 背景颜色
+    --placeholder-color: #aaaaaa; // 占位符颜色
+    --text-color: #000000; // 文本颜色
+    --border-color: #cccccc; // 边框颜色
+    --border-radius: 15px; // 边框圆角
+    --box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); // 阴影效果
+    // 你可以添加更多的CSS变量来定制样式
+  }
+  .button-container {
+    text-align: center;
+    padding: 16px;
+    border-radius: 8px;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    transition: all 0.3s ease;
+  }
+   
+  .button-container:hover {
+    transform: translateY(-4px);
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+  }
+   
+  .item-image {
+    width: 100%;
+    height: auto;
+    border-radius: 8px 8px 0 0;
+  }
+   
+  .item-text {
+    margin-top: 0px;
+    font-size: 14px;
+    color: #333;
+  }
+  .custom-padding .button-container {
+    padding: 0px;
+    box-shadow: none;
+  }
+  ion-content {
+    --background: rgb(231, 244, 247);
+  }
+  // ion-avatar{
+  //   position: absolute;
+  //   top: 0;
+  // }
+  
+  ion-toolbar {
+    --background:rgb(231, 244, 247);;; /* 使用CSS变量设置背景色 */
+  }
+  ion-grid {
+    padding: 5px;
+  }
+  
+  ion-col {
+    width: 50%; // Adjust the width based on the number of columns you want
+  }
+  
+  ion-card {
+    margin-bottom: 10px;
+  }
+  
+  // You can use media queries to adjust the column width on different screen sizes
+  @media (min-width: 576px) {
+    ion-col {
+      min-height: 200px; // 较小屏幕下，设置一个最小高度，让布局看起来更规整
+    }
+  }
+
+  @media (min-width: 768px) {
+    ion-col {
+      min-height: 250px; // 中等屏幕下，适当增加最小高度
+    }
+  }
+
+  @media (min-width: 992px) {
+    ion-col {
+      min-height: 300px; // 大屏幕下，再增加最小高度，使布局更有瀑布流错落感
+    }}

smarthotel-app/src/app/tab3/tab3.page.spec.ts → tailor-app/myapp/src/app/yiyun/yiyun.page.spec.ts

@@ -1,13 +1,12 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { YiyunPage } from './yiyun.page';
 
-import { Tab3Page } from './tab3.page';
+describe('YiyunPage', () => {
+  let component: YiyunPage;
+  let fixture: ComponentFixture<YiyunPage>;
 
-describe('Tab3Page', () => {
-  let component: Tab3Page;
-  let fixture: ComponentFixture<Tab3Page>;
-
-  beforeEach(async () => {
-    fixture = TestBed.createComponent(Tab3Page);
+  beforeEach(() => {
+    fixture = TestBed.createComponent(YiyunPage);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });

tailor-app/myapp/src/app/yiyun/yiyun.page.ts

@@ -0,0 +1,48 @@
+import { Component, NgModule, OnInit } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { ItemReorderEventDetail } from '@ionic/angular/standalone';
+import { addIcons } from 'ionicons';
+import { camera,trendingUpOutline,sparklesOutline,cloudyOutline,diceOutline} from 'ionicons/icons';
+import { IonContent, IonHeader, IonTitle, IonToolbar, IonButton, IonLabel, IonItem, IonList, IonBackButton, IonButtons, IonIcon, IonItemDivider, IonAvatar, IonThumbnail, IonItemOptions, IonItemOption, IonItemSliding, IonInput, IonCheckbox, IonRadio, IonToggle, IonRadioGroup, IonSearchbar,IonSegment,IonSegmentButton,IonDatetime,IonFooter,IonCardContent,IonCardTitle,IonCardHeader,IonCard,IonCol,IonRow,IonGrid,IonChip,IonImg } from '@ionic/angular/standalone';
+addIcons({camera,trendingUpOutline,sparklesOutline,cloudyOutline,diceOutline})
+@Component({
+  selector: 'app-yiyun',
+  templateUrl: './yiyun.page.html',
+  styleUrls: ['./yiyun.page.scss'],
+  standalone: true,
+  imports: [IonContent, IonHeader, IonTitle, IonToolbar, CommonModule, FormsModule, IonButton,  IonLabel, IonLabel, IonList, IonItem, IonBackButton, IonButtons, IonIcon, IonItemDivider, IonAvatar, IonThumbnail, IonItemOptions, IonItemSliding, IonItemOption, IonItemOptions,IonInput,IonCheckbox,IonRadio,IonToggle,IonRadioGroup,IonSearchbar,IonSegment,IonSegmentButton,IonDatetime,IonFooter,IonCardContent,IonCardTitle,IonCardHeader,IonCard,IonCol,IonRow,IonGrid,IonChip,IonImg ]
+
+})
+
+
+export class YiyunPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+  public items = [
+    { text: '趋势分析', image: 'trending-up-outline', page: '/page1' },
+    { text: 'AI定制', image: 'dice-outline', page: '/page2' },
+    { text: '活动优惠', image: 'sparkles-outline', page: '/page3' },
+    { text: '虚拟试衣', image: 'cloudy-outline', page: '/page4' },
+    
+  ];
+
+  products: any[] = [
+    { image: 'assets/img/shi.png', name: '商品1', description: '这是一个商品描述', price: 99.99 },
+    { image: 'assets/img/shi.png', name: '商品2', description: '这是一个商品描述', price: 199.99 },
+    { image: 'assets/img/shi.png', name: '商品1', description: '这是一个商品描述', price: 99.99 },
+    { image: 'assets/img/shi.png', name: '商品2', description: '这是一个商品描述', price: 199.99 },
+
+    // ... 更多商品数据
+  ];
+
+
+  // 打开登陆页面
+  openLoginModal(){
+    console.log("打开登陆页面");
+    
+  }
+}

smarthotel-app/src/index.html → tailor-app/myapp/src/index.html

@@ -15,7 +15,7 @@
   <link rel="icon" type="image/png" href="assets/icon/favicon.png" />
 
   <!-- add to homescreen for ios -->
-  <meta name="mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-capable" content="yes" />
   <meta name="apple-mobile-web-app-status-bar-style" content="black" />
 </head>
 

smarthotel-app/src/main.ts → tailor-app/myapp/src/main.ts

@@ -1,33 +1,25 @@
 import { bootstrapApplication } from '@angular/platform-browser';
 import { RouteReuseStrategy, provideRouter, withPreloading, PreloadAllModules } from '@angular/router';
 import { IonicRouteStrategy, provideIonicAngular } from '@ionic/angular/standalone';
+
 import { routes } from './app/app.routes';
 import { AppComponent } from './app/app.component';
-
-
+// let token = "r:16cd8f27084ff647fcdb5308a6783c4c"
 // 引用HttpClient方法
 import { provideHttpClient } from '@angular/common/http';
 // 引用移动端授权检测供应器
 import { Diagnostic } from '@awesome-cordova-plugins/diagnostic/ngx';
 // 设置Parse服务属性
 import Parse from "parse";
-
-
 Parse.initialize("ncloudmaster");
 Parse.serverURL = "https://server.fmode.cn/parse";
 localStorage.setItem("NOVA_APIG_SERVER", 'aHR0cHMlM0ElMkYlMkZzZXJ2ZXIuZm1vZGUuY24lMkZhcGklMkZhcGlnJTJG')
-
-// 注意：替换Token 根据Token设置Parse服务帐套权限
-Parse.User.become('JSON.parse(localStorage.getItem("Parse/ncloudmaster/currentUser"))?.sessionToken')
-
-// JSON.parse(localStorage.getItem("Parse/ncloudmaster/currentUser"))?.sessionToken
-
+Parse.User.become("r:16cd8f27084ff647fcdb5308a6783c4c")
 bootstrapApplication(AppComponent, {
   providers: [
     { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
     provideIonicAngular(),
     provideRouter(routes, withPreloading(PreloadAllModules)),
-    // 添加HttpClient供应器
     provideHttpClient(),
     // 添加Diagnostic
     Diagnostic,