瀏覽代碼

fix: vibration

0235473 4 天之前
父節點
當前提交
16e4b4bb22

+ 89 - 1
travel-platform-web/travel-web/package-lock.json

@@ -16,6 +16,11 @@
         "@angular/material": "^20.0.4",
         "@angular/platform-browser": "^20.0.0",
         "@angular/router": "^20.0.5",
+        "@fortawesome/angular-fontawesome": "^2.0.1",
+        "@fortawesome/fontawesome-svg-core": "^6.7.2",
+        "@fortawesome/free-solid-svg-icons": "^6.7.2",
+        "@types/swiper": "^5.4.3",
+        "echarts": "^5.6.0",
         "rxjs": "~7.8.0",
         "swiper": "^11.2.10",
         "tslib": "^2.3.0",
@@ -1264,6 +1269,52 @@
         "node": ">=18"
       }
     },
+    "node_modules/@fortawesome/angular-fontawesome": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@fortawesome/angular-fontawesome/-/angular-fontawesome-2.0.1.tgz",
+      "integrity": "sha512-IdklZkuw+WS2GQWhFnr1EX/tOALnrKaj4YGnUmPaUg2Uf+Amj8Xi+M/qDrr915YJ5MaDxd9tZ1kqOHRcvQqq2A==",
+      "license": "MIT",
+      "dependencies": {
+        "@fortawesome/fontawesome-svg-core": "^6.7.2",
+        "tslib": "^2.8.1"
+      },
+      "peerDependencies": {
+        "@angular/core": "^20.0.0"
+      }
+    },
+    "node_modules/@fortawesome/fontawesome-common-types": {
+      "version": "6.7.2",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.7.2.tgz",
+      "integrity": "sha512-Zs+YeHUC5fkt7Mg1l6XTniei3k4bwG/yo3iFUtZWd/pMx9g3fdvkSK9E0FOC+++phXOka78uJcYb8JaFkW52Xg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@fortawesome/fontawesome-svg-core": {
+      "version": "6.7.2",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.7.2.tgz",
+      "integrity": "sha512-yxtOBWDrdi5DD5o1pmVdq3WMCvnobT0LU6R8RyyVXPvFRd2o79/0NCuQoCjNTeZz9EzA9xS3JxNWfv54RIHFEA==",
+      "license": "MIT",
+      "dependencies": {
+        "@fortawesome/fontawesome-common-types": "6.7.2"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@fortawesome/free-solid-svg-icons": {
+      "version": "6.7.2",
+      "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.7.2.tgz",
+      "integrity": "sha512-GsBrnOzU8uj0LECDfD5zomZJIjrPhIlWU82AHwa2s40FKH+kcxQaBvBo3Z4TxyZHIyX8XTDxsyA33/Vx9eFuQA==",
+      "license": "(CC-BY-4.0 AND MIT)",
+      "dependencies": {
+        "@fortawesome/fontawesome-common-types": "6.7.2"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/@inquirer/checkbox": {
       "version": "4.1.8",
       "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-4.1.8.tgz",
@@ -3318,6 +3369,12 @@
         "undici-types": "~7.8.0"
       }
     },
+    "node_modules/@types/swiper": {
+      "version": "5.4.3",
+      "resolved": "https://registry.npmjs.org/@types/swiper/-/swiper-5.4.3.tgz",
+      "integrity": "sha512-hJXpVeANf+XQXgbvmuFZdsnaSOKqOEZcaLDnHhZOJDRow+lfboatwubW+Ay9XiHobMGyEomkgpXSYRlDVn4gMQ==",
+      "license": "MIT"
+    },
     "node_modules/@vitejs/plugin-basic-ssl": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-basic-ssl/-/plugin-basic-ssl-2.0.0.tgz",
@@ -4386,6 +4443,22 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/echarts": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/echarts/-/echarts-5.6.0.tgz",
+      "integrity": "sha512-oTbVTsXfKuEhxftHqL5xprgLoc0k7uScAwtryCgWF6hPYFLRwOUHiFmHGCBKP5NPFNkDVopOieyUqYGH8Fa3kA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "tslib": "2.3.0",
+        "zrender": "5.6.1"
+      }
+    },
+    "node_modules/echarts/node_modules/tslib": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
+      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
+      "license": "0BSD"
+    },
     "node_modules/ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@@ -8142,7 +8215,7 @@
     },
     "node_modules/swiper": {
       "version": "11.2.10",
-      "resolved": "https://registry.npmmirror.com/swiper/-/swiper-11.2.10.tgz",
+      "resolved": "https://registry.npmjs.org/swiper/-/swiper-11.2.10.tgz",
       "integrity": "sha512-RMeVUUjTQH+6N3ckimK93oxz6Sn5la4aDlgPzB+rBrG/smPdCTicXyhxa+woIpopz+jewEloiEE3lKo1h9w2YQ==",
       "funding": [
         {
@@ -8971,6 +9044,21 @@
       "resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.15.1.tgz",
       "integrity": "sha512-XE96n56IQpJM7NAoXswY3XRLcWFW83xe0BiAOeMD7K5k5xecOeul3Qcpx6GqEeeHNkW5DWL5zOyTbEfB4eti8w==",
       "license": "MIT"
+    },
+    "node_modules/zrender": {
+      "version": "5.6.1",
+      "resolved": "https://registry.npmjs.org/zrender/-/zrender-5.6.1.tgz",
+      "integrity": "sha512-OFXkDJKcrlx5su2XbzJvj/34Q3m6PvyCZkVPHGYpcCJ52ek4U/ymZyfuV1nKE23AyBJ51E/6Yr0mhZ7xGTO4ag==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "tslib": "2.3.0"
+      }
+    },
+    "node_modules/zrender/node_modules/tslib": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
+      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
+      "license": "0BSD"
     }
   }
 }

+ 5 - 0
travel-platform-web/travel-web/package.json

@@ -28,6 +28,11 @@
     "@angular/material": "^20.0.4",
     "@angular/platform-browser": "^20.0.0",
     "@angular/router": "^20.0.5",
+    "@fortawesome/angular-fontawesome": "^2.0.1",
+    "@fortawesome/fontawesome-svg-core": "^6.7.2",
+    "@fortawesome/free-solid-svg-icons": "^6.7.2",
+    "@types/swiper": "^5.4.3",
+    "echarts": "^5.6.0",
     "rxjs": "~7.8.0",
     "swiper": "^11.2.10",
     "tslib": "^2.3.0",

+ 14 - 3
travel-platform-web/travel-web/src/app/app.config.ts

@@ -1,4 +1,4 @@
-import { ApplicationConfig } from '@angular/core';
+//import { ApplicationConfig } from '@angular/core';
 import { provideRouter } from '@angular/router';
 import { routes } from './app.routes';
 import { provideAnimations } from '@angular/platform-browser/animations';
@@ -10,6 +10,17 @@ export const appConfig: ApplicationConfig = {
     provideRouter(routes),
     provideAnimations(),
     provideHttpClient(),
-    MatIconModule
+     MatIconModule,
+     
+    provideRouter([]),
+    importProvidersFrom(FontAwesomeModule)
+   
   ]
-};
+};
+import { ApplicationConfig, importProvidersFrom } from '@angular/core';
+import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
+import { library } from '@fortawesome/fontawesome-svg-core';
+import { fas } from '@fortawesome/free-solid-svg-icons';
+
+library.add(fas);
+

+ 1 - 1
travel-platform-web/travel-web/src/crm/mobile/mobile.routes.ts

@@ -16,7 +16,7 @@ export const MOBILE_ROUTES: Routes = [
       },
       {
         path: 'business',
-        loadComponent: () => import('./page-crm-business/page-crm-business').then(m => m.PageCrmBusiness)
+        loadComponent: () => import('./page-crm-business/page-vibration-monitor.component').then(m => m.PageVibrationMonitorComponent)
       },
       {
         path: 'member',

+ 0 - 421
travel-platform-web/travel-web/src/crm/mobile/page-crm-business/page-crm-business.html

@@ -1,421 +0,0 @@
-<!DOCTYPE html>
-<html lang="zh-CN">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>协会核心业务 - AI赋能平台</title>
-    <!-- 引入国内CDN资源 -->
-    <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
-    <link href="https://cdn.bootcdn.net/ajax/libs/animate.css/4.1.1/animate.min.css" rel="stylesheet">
-    <script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.4.2/echarts.min.js"></script>
-    <script src="https://cdn.bootcdn.net/ajax/libs/Swiper/8.4.5/swiper-bundle.min.js"></script>
-    <link href="https://cdn.bootcdn.net/ajax/libs/Swiper/8.4.5/swiper-bundle.min.css" rel="stylesheet">
-    <link href="page-crm-business.scss" rel="stylesheet">
-</head>
-<body>
-    
-    <div class="container">
-        <header class="animate__animated animate__fadeIn">
-            <h1>协会核心业务平台</h1>
-            <p class="subtitle">AI赋能 · 智慧协同 · 创新发展</p>
-        </header>
-        
-        <section class="section">
-            <h2 class="section-title">核心AI功能展示</h2>
-            <div class="ai-features">
-                <div class="feature-card animate__animated animate__fadeInUp">
-                    <div class="feature-icon">
-                        <i class="fas fa-brain"></i>
-                    </div>
-                    <h3 class="feature-title">智能知识图谱</h3>
-                    <p class="feature-desc">通过知识图谱技术可视化展示协会组织架构,实现关系网络智能分析,支持动态探索与交互查询。</p>
-                    <a href="#organization" class="btn">立即体验</a>
-                </div>
-                
-                <div class="feature-card animate__animated animate__fadeInUp" style="animation-delay: 0.2s;">
-                    <div class="feature-icon">
-                        <i class="fas fa-user-tie"></i>
-                    </div>
-                    <h3 class="feature-title">AR名片系统</h3>
-                    <p class="feature-desc">创新性的AR技术展示协会领导信息,扫描即可获取立体名片,支持语音介绍与联系方式一键保存。</p>
-                    <a href="#leaders" class="btn">查看领导</a>
-                </div>
-                
-                <div class="feature-card animate__animated animate__fadeInUp" style="animation-delay: 0.4s;">
-                    <div class="feature-icon">
-                        <i class="fas fa-graduation-cap"></i>
-                    </div>
-                    <h3 class="feature-title">AI+文旅课程</h3>
-                    <p class="feature-desc">微专业中心提供的智能学习系统,个性化推荐课程,AI助教实时答疑,学习路径智能规划。</p>
-                    <a href="#courses" class="btn">开始学习</a>
-                </div>
-            </div>
-        </section>
-        
-        <section class="section" id="organization">
-            <h2 class="section-title">3.1 走进协会</h2>
-            
-            <div class="subsection">
-                <h3 class="subsection-title"><i class="fas fa-sitemap"></i>组织架构 - 知识图谱可视化</h3>
-                <p>通过交互式知识图谱展示协会各部门关系网络,点击节点可查看详细信息,支持智能搜索与关系路径分析。</p>
-                <div id="knowledge-graph"></div>
-                <div class="search-container">
-                    <input type="text" class="search-input" placeholder="输入部门或人员名称进行搜索...">
-                    <button class="search-btn"><i class="fas fa-search"></i></button>
-                </div>
-            </div>
-            
-            <div class="subsection" id="leaders">
-                <h3 class="subsection-title"><i class="fas fa-id-card"></i>协会领导 - AR名片系统</h3>
-                <p>点击下方领导名片查看AR效果,支持手机扫描二维码获取立体名片,包含语音介绍、联系方式和工作履历。</p>
-                
-                <div class="ar-cards">
-                    <div class="ar-card">
-                        <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="会长" class="ar-card-img">
-                        <div class="ar-card-name">毕杨辉</div>
-                        <div class="ar-card-title">协会会长</div>
-                        <button class="ar-card-btn"><i class="fas fa-qrcode"></i> AR名片</button>
-                    </div>
-                    
-                    <div class="ar-card">
-                        <img src="https://randomuser.me/api/portraits/women/44.jpg" alt="副会长" class="ar-card-img">
-                        <div class="ar-card-name">李静怡</div>
-                        <div class="ar-card-title">常务副会长</div>
-                        <button class="ar-card-btn"><i class="fas fa-qrcode"></i> AR名片</button>
-                    </div>
-                    
-                    <div class="ar-card">
-                        <img src="https://randomuser.me/api/portraits/men/67.jpg" alt="秘书长" class="ar-card-img">
-                        <div class="ar-card-name">王建国</div>
-                        <div class="ar-card-title">秘书长</div>
-                        <button class="ar-card-btn"><i class="fas fa-qrcode"></i> AR名片</button>
-                    </div>
-                    
-                    <div class="ar-card">
-                        <img src="https://randomuser.me/api/portraits/women/28.jpg" alt="副秘书长" class="ar-card-img">
-                        <div class="ar-card-name">啊祥</div>
-                        <div class="ar-card-title">保洁员</div>
-                        <button class="ar-card-btn"><i class="fas fa-qrcode"></i> AR名片</button>
-                    </div>
-                </div>
-            </div>
-            
-            <div class="subsection">
-                <h3 class="subsection-title"><i class="fas fa-book"></i>协会章程 - 智能检索版</h3>
-                <p>智能检索系统支持自然语言查询,可快速定位章程条款,提供版本对比和修订历史追溯功能。</p>
-                <div class="search-container">
-                    <input type="text" class="search-input" placeholder="输入关键词查询章程内容,例如:会员权利、组织架构...">
-                    <button class="search-btn"><i class="fas fa-search"></i> 智能检索</button>
-                </div>
-                <div style="background: #f9f9f9; padding: 15px; border-radius: 5px; margin-top: 15px; min-height: 100px;">
-                    <p style="color: #666; text-align: center;">检索结果将显示在这里</p>
-                </div>
-            </div>
-        </section>
-        
-        <section class="section">
-            <h2 class="section-title">3.2 学术体系</h2>
-            
-            <div class="subsection">
-                <h3 class="subsection-title"><i class="fas fa-calendar-alt"></i>学术活动 - AI日程管理</h3>
-                <p>智能日程管理系统自动同步学术活动安排,支持个性化提醒、参会人员统计和活动效果预测。</p>
-                
-                <!-- 学术活动轮播图 -->
-                <div class="swiper">
-                    <div class="swiper-wrapper">
-                        <div class="swiper-slide" style="background-image: url('https://images.unsplash.com/photo-1434030216411-0b793f4b4173?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80');">
-                            <div class="slide-content">
-                                <h4 class="slide-title">2023年智慧旅游高峰论坛</h4>
-                                <p>2023-11-15 | 北京国际会议中心</p>
-                                <button class="btn" style="margin-top: 10px;">立即报名</button>
-                            </div>
-                        </div>
-                        <div class="swiper-slide" style="background-image: url('https://images.unsplash.com/photo-1505373877841-8d25f7d46678?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80');">
-                            <div class="slide-content">
-                                <h4 class="slide-title">文旅融合创新发展研讨会</h4>
-                                <p>2023-12-05 | 上海浦东香格里拉酒店</p>
-                                <button class="btn" style="margin-top: 10px;">立即报名</button>
-                            </div>
-                        </div>
-                        <div class="swiper-slide" style="background-image: url('https://images.unsplash.com/photo-1541178735493-479c1a27ed24?ixlib=rb-1.2.1&auto=format&fit=crop&w=1351&q=80');">
-                            <div class="slide-content">
-                                <h4 class="slide-title">数字文旅技术应用培训</h4>
-                                <p>2024-01-10 | 线上直播</p>
-                                <button class="btn" style="margin-top: 10px;">立即报名</button>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="swiper-pagination"></div>
-                    <div class="swiper-button-next"></div>
-                    <div class="swiper-button-prev"></div>
-                </div>
-            </div>
-            
-            <div class="subsection">
-                <h3 class="subsection-title"><i class="fas fa-clipboard-list"></i>标准规范 - 智能检索+版本对比</h3>
-                <p>标准规范数据库支持智能检索、版本对比和差异分析,帮助用户快速了解规范更新内容。</p>
-                <div style="display: flex; gap: 15px; margin-top: 15px;">
-                    <div style="flex: 1; background: #e3f2fd; padding: 15px; border-radius: 5px;">
-                        <h4 style="margin-bottom: 10px; color: var(--primary-color);">旅游服务质量标准</h4>
-                        <p style="font-size: 0.9rem; color: #666;">最新版本: v3.2 (2023-06发布)</p>
-                        <button class="btn-outline" style="margin-top: 10px;">查看详情</button>
-                    </div>
-                    <div style="flex: 1; background: #e8f5e9; padding: 15px; border-radius: 5px;">
-                        <h4 style="margin-bottom: 10px; color: var(--secondary-color);">智慧景区建设指南</h4>
-                        <p style="font-size: 0.9rem; color: #666;">最新版本: v2.1 (2023-09发布)</p>
-                        <button class="btn-outline" style="margin-top: 10px; border-color: var(--secondary-color); color: var(--secondary-color);">查看详情</button>
-                    </div>
-                </div>
-            </div>
-            
-            <div class="subsection">
-                <h3 class="subsection-title"><i class="fas fa-users"></i>课题研究 - 在线协作平台</h3>
-                <p>提供课题研究的全流程在线协作环境,支持文档协同编辑、任务分配、进度跟踪和智能报告生成。</p>
-                <div style="background: #f5f5f5; padding: 15px; border-radius: 5px; margin-top: 15px; display: flex; align-items: center; gap: 15px;">
-                    <div style="font-size: 2rem; color: var(--primary-color);">
-                        <i class="fas fa-laptop-code"></i>
-                    </div>
-                    <div style="flex: 1;">
-                        <h4 style="margin-bottom: 5px;">"AI+文旅"创新应用研究</h4>
-                        <p style="font-size: 0.9rem; color: #666;">当前进度: 65% | 参与人员: 12人 | 最后更新: 2023-10-15</p>
-                    </div>
-                    <button class="btn">进入协作</button>
-                </div>
-            </div>
-        </section>
-        
-        <section class="section" id="courses">
-            <h2 class="section-title">3.3 人才培养</h2>
-            
-            <div class="subsection">
-                <h3 class="subsection-title"><i class="fas fa-trophy"></i>竞赛平台 - 旅游类竞赛申报</h3>
-                <p>一站式竞赛管理平台,支持在线申报、作品提交、专家评审和结果公示全流程数字化管理。</p>
-                <div style="background: #fff8e1; padding: 15px; border-radius: 5px; margin-top: 15px;">
-                    <h4 style="margin-bottom: 10px; color: #ff8f00;">2023年全国旅游创新大赛</h4>
-                    <p style="margin-bottom: 10px;">报名截止: 2023-11-30 | 决赛时间: 2024-01-15</p>
-                    <div style="display: flex; gap: 10px;">
-                        <button class="btn" style="background: #ff8f00;">立即报名</button>
-                        <button class="btn-outline" style="border-color: #ff8f00; color: #ff8f00;">查看往届作品</button>
-                    </div>
-                </div>
-            </div>
-            
-            <div class="subsection">
-                <h3 class="subsection-title"><i class="fas fa-graduation-cap"></i>微专业中心 - AI+文旅课程</h3>
-                <p>结合AI技术的文旅专业课程体系,提供个性化学习路径推荐和智能学习辅助。</p>
-                <div style="display: flex; gap: 15px; margin-top: 15px; flex-wrap: wrap;">
-                    <div style="flex: 1; min-width: 200px; background: white; border-radius: 5px; overflow: hidden; box-shadow: var(--shadow);">
-                        <div style="height: 120px; background: linear-gradient(135deg, #ff9a9e, #fad0c4); display: flex; align-items: center; justify-content: center; color: white; font-size: 2rem;">
-                            <i class="fas fa-robot"></i>
-                        </div>
-                        <div style="padding: 15px;">
-                            <h4 style="margin-bottom: 5px;">AI旅游推荐系统</h4>
-                            <p style="font-size: 0.8rem; color: #666; margin-bottom: 10px;">8周课程 | 中级难度</p>
-                            <button class="btn" style="width: 100%; padding: 5px;">开始学习</button>
-                        </div>
-                    </div>
-                    
-                    <div style="flex: 1; min-width: 200px; background: white; border-radius: 5px; overflow: hidden; box-shadow: var(--shadow);">
-                        <div style="height: 120px; background: linear-gradient(135deg, #a1c4fd, #c2e9fb); display: flex; align-items: center; justify-content: center; color: white; font-size: 2rem;">
-                            <i class="fas fa-map-marked-alt"></i>
-                        </div>
-                        <div style="padding: 15px;">
-                            <h4 style="margin-bottom: 5px;">智慧景区规划</h4>
-                            <p style="font-size: 0.8rem; color: #666; margin-bottom: 10px;">6周课程 | 初级难度</p>
-                            <button class="btn" style="width: 100%; padding: 5px;">开始学习</button>
-                        </div>
-                    </div>
-                    
-                    <div style="flex: 1; min-width: 200px; background: white; border-radius: 5px; overflow: hidden; box-shadow: var(--shadow);">
-                        <div style="height: 120px; background: linear-gradient(135deg, #ffecd2, #fcb69f); display: flex; align-items: center; justify-content: center; color: white; font-size: 2rem;">
-                            <i class="fas fa-chart-line"></i>
-                        </div>
-                        <div style="padding: 15px;">
-                            <h4 style="margin-bottom: 5px;">旅游大数据分析</h4>
-                            <p style="font-size: 0.8rem; color: #666; margin-bottom: 10px;">10周课程 | 高级难度</p>
-                            <button class="btn" style="width: 100%; padding: 5px;">开始学习</button>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            
-            <div class="subsection">
-                <h3 class="subsection-title"><i class="fas fa-database"></i>人才库 - 区块链履历认证</h3>
-                <p>基于区块链技术的人才履历认证系统,确保人才信息真实可信,支持智能匹配和推荐。</p>
-                
-                <div class="talent-card">
-                    <img src="https://randomuser.me/api/portraits/women/65.jpg" alt="人才" class="talent-avatar">
-                    <div class="talent-info">
-                        <div class="talent-name">翠花</div>
-                        <div>旅游规划师 | 5年经验</div>
-                        <div>
-                            <span class="talent-skill">景区规划</span>
-                            <span class="talent-skill">GIS应用</span>
-                            <span class="talent-skill">可持续发展</span>
-                        </div>
-                        <div class="blockchain-badge">
-                            <i class="fas fa-link"></i>区块链认证履历
-                        </div>
-                    </div>
-                </div>
-                
-                <div class="talent-card">
-                    <img src="https://randomuser.me/api/portraits/men/75.jpg" alt="人才" class="talent-avatar">
-                    <div class="talent-info">
-                        <div class="talent-name">熊大</div>
-                        <div>数字文旅工程师 | 3年经验</div>
-                        <div>
-                            <span class="talent-skill">VR/AR</span>
-                            <span class="talent-skill">Unity开发</span>
-                            <span class="talent-skill">交互设计</span>
-                        </div>
-                        <div class="blockchain-badge">
-                            <i class="fas fa-link"></i>区块链认证履历
-                        </div>
-                    </div>
-                </div>
-                
-                <div style="text-align: center; margin-top: 15px;">
-                    <button class="btn"><i class="fas fa-search"></i> 浏览更多人才</button>
-                </div>
-            </div>
-        </section>
-        
-        <footer style="text-align: center; padding: 30px 0; color: #666; font-size: 0.9rem;">
-            <p>© 2023 协会核心业务平台 - AI赋能智慧协会</p>
-            <p style="margin-top: 10px;">技术支持:江财天才团队 | 联系电话:400-123-4567</p>
-        </footer>
-    </div>
-
-    <script>
-        // 初始化知识图谱
-        document.addEventListener('DOMContentLoaded', function() {
-            // 知识图谱
-            const graphChart = echarts.init(document.getElementById('knowledge-graph'));
-            const graphOption = {
-                title: {
-                    text: '协会组织架构知识图谱',
-                    subtext: '点击节点查看详细信息',
-                    left: 'center'
-                },
-                tooltip: {},
-                legend: {
-                    data: ['部门', '人员'],
-                    orient: 'vertical',
-                    right: 10
-                },
-                series: [{
-                    name: '协会组织架构',
-                    type: 'graph',
-                    layout: 'force',
-                    data: [
-                        {id: '1', name: '理事会', category: 0, symbolSize: 50},
-                        {id: '2', name: '秘书处', category: 0, symbolSize: 40},
-                        {id: '3', name: '学术委员会', category: 0, symbolSize: 40},
-                        {id: '4', name: '培训部', category: 0, symbolSize: 35},
-                        {id: '5', name: '国际交流部', category: 0, symbolSize: 35},
-                        {id: '6', name: '张明远', category: 1, symbolSize: 30},
-                        {id: '7', name: '李静怡', category: 1, symbolSize: 25},
-                        {id: '8', name: '王建国', category: 1, symbolSize: 25},
-                        {id: '9', name: '赵雨晴', category: 1, symbolSize: 25},
-                        {id: '10', name: '陈教授', category: 1, symbolSize: 20},
-                        {id: '11', name: '刘主任', category: 1, symbolSize: 20}
-                    ],
-                    links: [
-                        {source: '1', target: '2'},
-                        {source: '1', target: '3'},
-                        {source: '1', target: '4'},
-                        {source: '1', target: '5'},
-                        {source: '6', target: '1'},
-                        {source: '7', target: '1'},
-                        {source: '8', target: '2'},
-                        {source: '9', target: '2'},
-                        {source: '10', target: '3'},
-                        {source: '11', target: '4'}
-                    ],
-                    categories: [
-                        {name: '部门'},
-                        {name: '人员'}
-                    ],
-                    roam: true,
-                    label: {
-                        show: true,
-                        position: 'right'
-                    },
-                    force: {
-                        repulsion: 100,
-                        edgeLength: [50, 100]
-                    },
-                    emphasis: {
-                        focus: 'adjacency',
-                        label: {
-                            show: true
-                        }
-                    },
-                    lineStyle: {
-                        width: 1,
-                        curveness: 0.2
-                    }
-                }],
-                color: ['#3498db', '#2ecc71']
-            };
-            graphChart.setOption(graphOption);
-            
-            // 窗口大小变化时重新调整图表大小
-            window.addEventListener('resize', function() {
-                graphChart.resize();
-            });
-            
-            // 初始化轮播图
-            const swiper = new Swiper('.swiper', {
-                loop: true,
-                autoplay: {
-                    delay: 5000,
-                    disableOnInteraction: false,
-                },
-                pagination: {
-                    el: '.swiper-pagination',
-                    clickable: true,
-                },
-                navigation: {
-                    nextEl: '.swiper-button-next',
-                    prevEl: '.swiper-button-prev',
-                },
-            });
-            
-            // AR名片按钮点击效果
-            document.querySelectorAll('.ar-card-btn').forEach(btn => {
-                btn.addEventListener('click', function() {
-                    const card = this.closest('.ar-card');
-                    card.classList.add('animate__animated', 'animate__pulse');
-                    setTimeout(() => {
-                        card.classList.remove('animate__animated', 'animate__pulse');
-                    }, 1000);
-                    
-                    // 模拟AR效果
-                    alert('请使用手机扫描二维码查看AR名片效果\n\n姓名: ' + card.querySelector('.ar-card-name').textContent + '\n职位: ' + card.querySelector('.ar-card-title').textContent);
-                });
-            });
-            
-            // 搜索功能模拟
-            document.querySelectorAll('.search-btn').forEach(btn => {
-                btn.addEventListener('click', function() {
-                    const input = this.previousElementSibling;
-                    if(input.value.trim() === '') {
-                        input.classList.add('animate__animated', 'animate__shakeX');
-                        setTimeout(() => {
-                            input.classList.remove('animate__animated', 'animate__shakeX');
-                        }, 1000);
-                    } else {
-                        this.innerHTML = '<i class="fas fa-spinner fa-spin"></i>';
-                        setTimeout(() => {
-                            this.innerHTML = '<i class="fas fa-search"></i>';
-                            alert('搜索关键词: ' + input.value + '\n\n模拟搜索功能,实际应用中会显示真实结果');
-                        }, 1000);
-                    }
-                });
-            });
-        });
-    </script>
-</body>
-</html>

+ 0 - 382
travel-platform-web/travel-web/src/crm/mobile/page-crm-business/page-crm-business.scss

@@ -1,382 +0,0 @@
-// 变量定义
-$primary-color: #3498db;
-$secondary-color: #2ecc71;
-$accent-color: #e74c3c;
-$dark-color: #2c3e50;
-$light-color: #ecf0f1;
-$shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-
-* {
-    margin: 0;
-    padding: 0;
-    box-sizing: border-box;
-    font-family: 'Microsoft YaHei', sans-serif;
-}
-
-body {
-    background-color: #f5f7fa;
-    color: #333;
-    line-height: 1.6;
-}
-
-.container {
-    max-width: 1200px;
-    margin: 0 auto;
-    padding: 20px;
-}
-
-header {
-    background: linear-gradient(135deg, $primary-color, $secondary-color);
-    color: white;
-    padding: 30px 0;
-    text-align: center;
-    border-radius: 10px;
-    margin-bottom: 30px;
-    box-shadow: $shadow;
-    position: relative;
-    overflow: hidden;
-    
-    &::before {
-        content: '';
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="none"><path d="M0,0 L100,0 L100,100 L0,100 Z" fill="none" stroke="rgba(255,255,255,0.1)" stroke-width="2"/></svg>');
-        background-size: 20px 20px;
-        opacity: 0.3;
-    }
-}
-
-h1 {
-    font-size: 2.5rem;
-    margin-bottom: 10px;
-    position: relative;
-    z-index: 1;
-}
-
-.subtitle {
-    font-size: 1.2rem;
-    opacity: 0.9;
-    position: relative;
-    z-index: 1;
-}
-
-.ai-features {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 20px;
-    margin-bottom: 30px;
-}
-
-.feature-card {
-    flex: 1 1 300px;
-    background: white;
-    border-radius: 10px;
-    padding: 25px;
-    box-shadow: $shadow;
-    transition: transform 0.3s, box-shadow 0.3s;
-    position: relative;
-    overflow: hidden;
-    
-    &:hover {
-        transform: translateY(-5px);
-        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
-    }
-    
-    &::after {
-        content: '';
-        position: absolute;
-        bottom: 0;
-        left: 0;
-        width: 100%;
-        height: 5px;
-        background: linear-gradient(90deg, $primary-color, $secondary-color);
-    }
-}
-
-.feature-icon {
-    font-size: 2.5rem;
-    color: $primary-color;
-    margin-bottom: 15px;
-}
-
-.feature-title {
-    font-size: 1.3rem;
-    margin-bottom: 10px;
-    color: $dark-color;
-}
-
-.feature-desc {
-    color: #666;
-    margin-bottom: 15px;
-}
-
-.btn {
-    display: inline-block;
-    padding: 8px 16px;
-    background: $primary-color;
-    color: white;
-    border-radius: 5px;
-    text-decoration: none;
-    transition: background 0.3s;
-    border: none;
-    cursor: pointer;
-    font-size: 0.9rem;
-    
-    &:hover {
-        background: darken($primary-color, 10%);
-    }
-}
-
-.btn-outline {
-    background: transparent;
-    border: 1px solid $primary-color;
-    color: $primary-color;
-    
-    &:hover {
-        background: $primary-color;
-        color: white;
-    }
-}
-
-.section {
-    margin-bottom: 40px;
-}
-
-.section-title {
-    font-size: 1.8rem;
-    color: $dark-color;
-    margin-bottom: 20px;
-    padding-bottom: 10px;
-    border-bottom: 2px solid $primary-color;
-    display: inline-block;
-}
-
-.subsection {
-    background: white;
-    border-radius: 10px;
-    padding: 20px;
-    margin-bottom: 20px;
-    box-shadow: $shadow;
-}
-
-.subsection-title {
-    font-size: 1.4rem;
-    color: $dark-color;
-    margin-bottom: 15px;
-    display: flex;
-    align-items: center;
-    
-    i {
-        margin-right: 10px;
-        color: $primary-color;
-    }
-}
-
-// 知识图谱可视化容器
-#knowledge-graph {
-    width: 100%;
-    height: 400px;
-    background: #f9f9f9;
-    border-radius: 8px;
-    margin: 15px 0;
-}
-
-// AR名片样式
-.ar-cards {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 15px;
-    margin-top: 20px;
-}
-
-.ar-card {
-    flex: 1 1 200px;
-    background: linear-gradient(135deg, #f5f7fa, #e4e8eb);
-    border-radius: 8px;
-    padding: 15px;
-    text-align: center;
-    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
-    transition: transform 0.3s;
-    
-    &:hover {
-        transform: scale(1.05);
-    }
-}
-
-.ar-card-img {
-    width: 80px;
-    height: 80px;
-    border-radius: 50%;
-    object-fit: cover;
-    margin: 0 auto 10px;
-    border: 3px solid $primary-color;
-}
-
-.ar-card-name {
-    font-weight: bold;
-    margin-bottom: 5px;
-}
-
-.ar-card-title {
-    color: #666;
-    font-size: 0.9rem;
-    margin-bottom: 10px;
-}
-
-.ar-card-btn {
-    background: $secondary-color;
-    color: white;
-    border: none;
-    padding: 5px 10px;
-    border-radius: 4px;
-    font-size: 0.8rem;
-    cursor: pointer;
-}
-
-// 智能检索区域
-.search-container {
-    display: flex;
-    margin: 20px 0;
-}
-
-.search-input {
-    flex: 1;
-    padding: 12px 15px;
-    border: 1px solid #ddd;
-    border-radius: 5px 0 0 5px;
-    font-size: 1rem;
-    outline: none;
-}
-
-.search-btn {
-    padding: 0 20px;
-    background: $primary-color;
-    color: white;
-    border: none;
-    border-radius: 0 5px 5px 0;
-    cursor: pointer;
-    transition: background 0.3s;
-    
-    &:hover {
-        background: darken($primary-color, 10%);
-    }
-}
-
-// 轮播图样式
-.swiper {
-    width: 100%;
-    height: 300px;
-    border-radius: 10px;
-    overflow: hidden;
-    margin: 20px 0;
-    box-shadow: $shadow;
-}
-
-.swiper-slide {
-    background-size: cover;
-    background-position: center;
-    display: flex;
-    align-items: flex-end;
-    padding: 30px;
-    color: white;
-    position: relative;
-    
-    &::before {
-        content: '';
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0.3));
-    }
-}
-
-.slide-content {
-    position: relative;
-    z-index: 1;
-    max-width: 80%;
-}
-
-.slide-title {
-    font-size: 1.5rem;
-    margin-bottom: 10px;
-}
-
-// 人才库卡片
-.talent-card {
-    display: flex;
-    background: white;
-    border-radius: 8px;
-    overflow: hidden;
-    box-shadow: $shadow;
-    margin-bottom: 15px;
-}
-
-.talent-avatar {
-    width: 80px;
-    height: 80px;
-    object-fit: cover;
-}
-
-.talent-info {
-    flex: 1;
-    padding: 15px;
-}
-
-.talent-name {
-    font-weight: bold;
-    margin-bottom: 5px;
-}
-
-.talent-skill {
-    display: inline-block;
-    background: #e0f7fa;
-    color: #00838f;
-    padding: 3px 8px;
-    border-radius: 4px;
-    font-size: 0.8rem;
-    margin-right: 5px;
-    margin-bottom: 5px;
-}
-
-.blockchain-badge {
-    display: inline-flex;
-    align-items: center;
-    background: #f3e5f5;
-    color: #6a1b9a;
-    padding: 3px 8px;
-    border-radius: 4px;
-    font-size: 0.8rem;
-    margin-top: 5px;
-    
-    i {
-        margin-right: 5px;
-    }
-}
-
-// 响应式调整
-@media (max-width: 768px) {
-    .ai-features {
-        flex-direction: column;
-    }
-    
-    .feature-card {
-        flex: 1 1 auto;
-    }
-    
-    .ar-cards {
-        flex-direction: column;
-    }
-    
-    .ar-card {
-        flex: 1 1 auto;
-    }
-    
-    .swiper {
-        height: 200px;
-    }
-}

+ 0 - 23
travel-platform-web/travel-web/src/crm/mobile/page-crm-business/page-crm-business.spec.ts

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

+ 0 - 14
travel-platform-web/travel-web/src/crm/mobile/page-crm-business/page-crm-business.ts

@@ -1,14 +0,0 @@
-import { Component } from '@angular/core';  // 添加这行导入
-import { RouterModule } from '@angular/router';
-
-@Component({
-  selector: 'page-crm-business',
-  imports: [
-    RouterModule // 新增路由导航模块
-  ],
-  templateUrl: './page-crm-business.html',
-  styleUrl: './page-crm-business.scss'
-})
-export class PageCrmBusiness {
-
-}

+ 273 - 0
travel-platform-web/travel-web/src/crm/mobile/page-crm-business/page-vibration-monitor.component.html

@@ -0,0 +1,273 @@
+<!-- page-vibration-monitor.component.html -->
+<div class="container">
+  <header class="animate__animated animate__fadeIn">
+    <h1>协会核心业务平台</h1>
+    <p class="subtitle">AI赋能 · 智慧协同 · 创新发展</p>
+  </header>
+  
+  <section class="section">
+    <h2 class="section-title">核心AI功能展示</h2>
+    <div class="ai-features">
+      <div class="feature-card animate__animated animate__fadeInUp">
+        <div class="feature-icon">
+          <i class="fas fa-brain"></i>
+        </div>
+        <h3 class="feature-title">智能知识图谱</h3>
+        <p class="feature-desc">通过知识图谱技术可视化展示协会组织架构,实现关系网络智能分析,支持动态探索与交互查询。</p>
+        <a href="#organization" class="btn">立即体验</a>
+      </div>
+      
+      <div class="feature-card animate__animated animate__fadeInUp" style="animation-delay: 0.2s;">
+        <div class="feature-icon">
+          <i class="fas fa-user-tie"></i>
+        </div>
+        <h3 class="feature-title">AR名片系统</h3>
+        <p class="feature-desc">创新性的AR技术展示协会领导信息,扫描即可获取立体名片,支持语音介绍与联系方式一键保存。</p>
+        <a href="#leaders" class="btn">查看领导</a>
+      </div>
+      
+      <div class="feature-card animate__animated animate__fadeInUp" style="animation-delay: 0.4s;">
+        <div class="feature-icon">
+          <i class="fas fa-graduation-cap"></i>
+        </div>
+        <h3 class="feature-title">AI+文旅课程</h3>
+        <p class="feature-desc">微专业中心提供的智能学习系统,个性化推荐课程,AI助教实时答疑,学习路径智能规划。</p>
+        <a href="#courses" class="btn">开始学习</a>
+      </div>
+    </div>
+  </section>
+  
+  <section class="section" id="organization">
+    <h2 class="section-title">3.1 走进协会</h2>
+    
+    <div class="subsection">
+      <h3 class="subsection-title"><i class="fas fa-sitemap"></i>组织架构 - 知识图谱可视化</h3>
+      <p>通过交互式知识图谱展示协会各部门关系网络,点击节点可查看详细信息,支持智能搜索与关系路径分析。</p>
+      <div id="knowledge-graph"></div>
+      <div class="search-container">
+        <input type="text" class="search-input" placeholder="输入部门或人员名称进行搜索..." #searchInput>
+        <button class="search-btn" (click)="onSearch(searchInput, searchBtn)" #searchBtn><i class="fas fa-search"></i></button>
+      </div>
+    </div>
+    
+    <div class="subsection" id="leaders">
+      <h3 class="subsection-title"><i class="fas fa-id-card"></i>协会领导 - AR名片系统</h3>
+      <p>点击下方领导名片查看AR效果,支持手机扫描二维码获取立体名片,包含语音介绍、联系方式和工作履历。</p>
+      
+      <div class="ar-cards">
+        <div class="ar-card">
+          <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="会长" class="ar-card-img">
+          <div class="ar-card-name">张明远</div>
+          <div class="ar-card-title">协会会长</div>
+          <button class="ar-card-btn"><i class="fas fa-qrcode"></i> AR名片</button>
+        </div>
+        
+        <div class="ar-card">
+          <img src="https://randomuser.me/api/portraits/women/44.jpg" alt="副会长" class="ar-card-img">
+          <div class="ar-card-name">李静怡</div>
+          <div class="ar-card-title">常务副会长</div>
+          <button class="ar-card-btn"><i class="fas fa-qrcode"></i> AR名片</button>
+        </div>
+        
+        <div class="ar-card">
+          <img src="https://randomuser.me/api/portraits/men/67.jpg" alt="秘书长" class="ar-card-img">
+          <div class="ar-card-name">王建国</div>
+          <div class="ar-card-title">秘书长</div>
+          <button class="ar-card-btn"><i class="fas fa-qrcode"></i> AR名片</button>
+        </div>
+        
+        <div class="ar-card">
+          <img src="https://randomuser.me/api/portraits/women/28.jpg" alt="副秘书长" class="ar-card-img">
+          <div class="ar-card-name">赵雨晴</div>
+          <div class="ar-card-title">副秘书长</div>
+          <button class="ar-card-btn"><i class="fas fa-qrcode"></i> AR名片</button>
+        </div>
+      </div>
+    </div>
+    
+    <div class="subsection">
+      <h3 class="subsection-title"><i class="fas fa-book"></i>协会章程 - 智能检索版</h3>
+      <p>智能检索系统支持自然语言查询,可快速定位章程条款,提供版本对比和修订历史追溯功能。</p>
+      <div class="search-container">
+        <input type="text" class="search-input" placeholder="输入关键词查询章程内容,例如:会员权利、组织架构..." #statuteInput>
+        <button class="search-btn" (click)="onSearch(statuteInput, statuteBtn)" #statuteBtn><i class="fas fa-search"></i> 智能检索</button>
+      </div>
+      <div style="background: #f9f9f9; padding: 15px; border-radius: 5px; margin-top: 15px; min-height: 100px;">
+        <p style="color: #666; text-align: center;">检索结果将显示在这里</p>
+      </div>
+    </div>
+  </section>
+  
+  <section class="section">
+    <h2 class="section-title">3.2 学术体系</h2>
+    
+    <div class="subsection">
+      <h3 class="subsection-title"><i class="fas fa-calendar-alt"></i>学术活动 - AI日程管理</h3>
+      <p>智能日程管理系统自动同步学术活动安排,支持个性化提醒、参会人员统计和活动效果预测。</p>
+      
+      <!-- 学术活动轮播图 -->
+      <div class="swiper">
+        <div class="swiper-wrapper">
+          <div class="swiper-slide" style="background-image: url('https://images.unsplash.com/photo-1434030216411-0b793f4b4173?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80');">
+            <div class="slide-content">
+              <h4 class="slide-title">2023年智慧旅游高峰论坛</h4>
+              <p>2023-11-15 | 北京国际会议中心</p>
+              <button class="btn" style="margin-top: 10px;">立即报名</button>
+            </div>
+          </div>
+          <div class="swiper-slide" style="background-image: url('https://images.unsplash.com/photo-1505373877841-8d25f7d46678?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80');">
+            <div class="slide-content">
+              <h4 class="slide-title">文旅融合创新发展研讨会</h4>
+              <p>2023-12-05 | 上海浦东香格里拉酒店</p>
+              <button class="btn" style="margin-top: 10px;">立即报名</button>
+            </div>
+          </div>
+          <div class="swiper-slide" style="background-image: url('https://images.unsplash.com/photo-1541178735493-479c1a27ed24?ixlib=rb-1.2.1&auto=format&fit=crop&w=1351&q=80');">
+            <div class="slide-content">
+              <h4 class="slide-title">数字文旅技术应用培训</h4>
+              <p>2024-01-10 | 线上直播</p>
+              <button class="btn" style="margin-top: 10px;">立即报名</button>
+            </div>
+          </div>
+        </div>
+        <div class="swiper-pagination"></div>
+        <div class="swiper-button-next"></div>
+        <div class="swiper-button-prev"></div>
+      </div>
+    </div>
+    
+    <div class="subsection">
+      <h3 class="subsection-title"><i class="fas fa-clipboard-list"></i>标准规范 - 智能检索+版本对比</h3>
+      <p>标准规范数据库支持智能检索、版本对比和差异分析,帮助用户快速了解规范更新内容。</p>
+      <div style="display: flex; gap: 15px; margin-top: 15px;">
+        <div style="flex: 1; background: #e3f2fd; padding: 15px; border-radius: 5px;">
+          <h4 style="margin-bottom: 10px; color: var(--primary-color);">旅游服务质量标准</h4>
+          <p style="font-size: 0.9rem; color: #666;">最新版本: v3.2 (2023-06发布)</p>
+          <button class="btn-outline" style="margin-top: 10px;">查看详情</button>
+        </div>
+        <div style="flex: 1; background: #e8f5e9; padding: 15px; border-radius: 5px;">
+          <h4 style="margin-bottom: 10px; color: var(--secondary-color);">智慧景区建设指南</h4>
+          <p style="font-size: 0.9rem; color: #666;">最新版本: v2.1 (2023-09发布)</p>
+          <button class="btn-outline" style="margin-top: 10px; border-color: var(--secondary-color); color: var(--secondary-color);">查看详情</button>
+        </div>
+      </div>
+    </div>
+    
+    <div class="subsection">
+      <h3 class="subsection-title"><i class="fas fa-users"></i>课题研究 - 在线协作平台</h3>
+      <p>提供课题研究的全流程在线协作环境,支持文档协同编辑、任务分配、进度跟踪和智能报告生成。</p>
+      <div style="background: #f5f5f5; padding: 15px; border-radius: 5px; margin-top: 15px; display: flex; align-items: center; gap: 15px;">
+        <div style="font-size: 2rem; color: var(--primary-color);">
+          <i class="fas fa-laptop-code"></i>
+        </div>
+        <div style="flex: 1;">
+          <h4 style="margin-bottom: 5px;">"AI+文旅"创新应用研究</h4>
+          <p style="font-size: 0.9rem; color: #666;">当前进度: 65% | 参与人员: 12人 | 最后更新: 2023-10-15</p>
+        </div>
+        <button class="btn">进入协作</button>
+      </div>
+    </div>
+  </section>
+  
+  <section class="section" id="courses">
+    <h2 class="section-title">3.3 人才培养</h2>
+    
+    <div class="subsection">
+      <h3 class="subsection-title"><i class="fas fa-trophy"></i>竞赛平台 - 旅游类竞赛申报</h3>
+      <p>一站式竞赛管理平台,支持在线申报、作品提交、专家评审和结果公示全流程数字化管理。</p>
+      <div style="background: #fff8e1; padding: 15px; border-radius: 5px; margin-top: 15px;">
+        <h4 style="margin-bottom: 10px; color: #ff8f00;">2023年全国旅游创新大赛</h4>
+        <p style="margin-bottom: 10px;">报名截止: 2023-11-30 | 决赛时间: 2024-01-15</p>
+        <div style="display: flex; gap: 10px;">
+          <button class="btn" style="background: #ff8f00;">立即报名</button>
+          <button class="btn-outline" style="border-color: #ff8f00; color: #ff8f00;">查看往届作品</button>
+        </div>
+      </div>
+    </div>
+    
+    <div class="subsection">
+      <h3 class="subsection-title"><i class="fas fa-graduation-cap"></i>微专业中心 - AI+文旅课程</h3>
+      <p>结合AI技术的文旅专业课程体系,提供个性化学习路径推荐和智能学习辅助。</p>
+      <div style="display: flex; gap: 15px; margin-top: 15px; flex-wrap: wrap;">
+        <div style="flex: 1; min-width: 200px; background: white; border-radius: 5px; overflow: hidden; box-shadow: var(--shadow);">
+          <div style="height: 120px; background: linear-gradient(135deg, #ff9a9e, #fad0c4); display: flex; align-items: center; justify-content: center; color: white; font-size: 2rem;">
+            <i class="fas fa-robot"></i>
+          </div>
+          <div style="padding: 15px;">
+            <h4 style="margin-bottom: 5px;">AI旅游推荐系统</h4>
+            <p style="font-size: 0.8rem; color: #666; margin-bottom: 10px;">8周课程 | 中级难度</p>
+            <button class="btn" style="width: 100%; padding: 5px;">开始学习</button>
+          </div>
+        </div>
+        
+        <div style="flex: 1; min-width: 200px; background: white; border-radius: 5px; overflow: hidden; box-shadow: var(--shadow);">
+          <div style="height: 120px; background: linear-gradient(135deg, #a1c4fd, #c2e9fb); display: flex; align-items: center; justify-content: center; color: white; font-size: 2rem;">
+            <i class="fas fa-map-marked-alt"></i>
+          </div>
+          <div style="padding: 15px;">
+            <h4 style="margin-bottom: 5px;">智慧景区规划</h4>
+            <p style="font-size: 0.8rem; color: #666; margin-bottom: 10px;">6周课程 | 初级难度</p>
+            <button class="btn" style="width: 100%; padding: 5px;">开始学习</button>
+          </div>
+        </div>
+        
+        <div style="flex: 1; min-width: 200px; background: white; border-radius: 5px; overflow: hidden; box-shadow: var(--shadow);">
+          <div style="height: 120px; background: linear-gradient(135deg, #ffecd2, #fcb69f); display: flex; align-items: center; justify-content: center; color: white; font-size: 2rem;">
+            <i class="fas fa-chart-line"></i>
+          </div>
+          <div style="padding: 15px;">
+            <h4 style="margin-bottom: 5px;">旅游大数据分析</h4>
+            <p style="font-size: 0.8rem; color: #666; margin-bottom: 10px;">10周课程 | 高级难度</p>
+            <button class="btn" style="width: 100%; padding: 5px;">开始学习</button>
+          </div>
+        </div>
+      </div>
+    </div>
+    
+    <div class="subsection">
+      <h3 class="subsection-title"><i class="fas fa-database"></i>人才库 - 区块链履历认证</h3>
+      <p>基于区块链技术的人才履历认证系统,确保人才信息真实可信,支持智能匹配和推荐。</p>
+      
+      <div class="talent-card">
+        <img src="https://randomuser.me/api/portraits/women/65.jpg" alt="人才" class="talent-avatar">
+        <div class="talent-info">
+          <div class="talent-name">翠花</div>
+          <div>旅游规划师 | 5年经验</div>
+          <div>
+            <span class="talent-skill">景区规划</span>
+            <span class="talent-skill">GIS应用</span>
+            <span class="talent-skill">可持续发展</span>
+          </div>
+          <div class="blockchain-badge">
+            <i class="fas fa-link"></i>区块链认证履历
+          </div>
+        </div>
+      </div>
+      
+      <div class="talent-card">
+        <img src="https://randomuser.me/api/portraits/men/75.jpg" alt="人才" class="talent-avatar">
+        <div class="talent-info">
+          <div class="talent-name">熊大</div>
+          <div>数字文旅工程师 | 3年经验</div>
+          <div>
+            <span class="talent-skill">VR/AR</span>
+            <span class="talent-skill">Unity开发</span>
+            <span class="talent-skill">交互设计</span>
+          </div>
+          <div class="blockchain-badge">
+            <i class="fas fa-link"></i>区块链认证履历
+          </div>
+        </div>
+      </div>
+      
+      <div style="text-align: center; margin-top: 15px;">
+        <button class="btn"><i class="fas fa-search"></i> 浏览更多人才</button>
+      </div>
+    </div>
+  </section>
+  
+  <footer style="text-align: center; padding: 30px 0; color: #666; font-size: 0.9rem;">
+    <p>© 2023 协会核心业务平台 - AI赋能智慧协会</p>
+    <p style="margin-top: 10px;">技术支持:江财天才团队 | 联系电话:400-123-4567</p>
+  </footer>
+</div>

+ 381 - 0
travel-platform-web/travel-web/src/crm/mobile/page-crm-business/page-vibration-monitor.component.scss

@@ -0,0 +1,381 @@
+/* page-vibration-monitor.component.scss */
+:host {
+  --primary-color: #3498db;
+  --secondary-color: #2ecc71;
+  --accent-color: #e74c3c;
+  --dark-color: #2c3e50;
+  --light-color: #ecf0f1;
+  --shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+}
+
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+  font-family: 'Microsoft YaHei', sans-serif;
+}
+
+.container {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 20px;
+  background-color: #f5f7fa;
+  color: #333;
+  line-height: 1.6;
+}
+
+header {
+  background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
+  color: white;
+  padding: 30px 0;
+  text-align: center;
+  border-radius: 10px;
+  margin-bottom: 30px;
+  box-shadow: var(--shadow);
+  position: relative;
+  overflow: hidden;
+}
+
+header::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="none"><path d="M0,0 L100,0 L100,100 L0,100 Z" fill="none" stroke="rgba(255,255,255,0.1)" stroke-width="2"/></svg>');
+  background-size: 20px 20px;
+  opacity: 0.3;
+}
+
+h1 {
+  font-size: 2.5rem;
+  margin-bottom: 10px;
+  position: relative;
+  z-index: 1;
+}
+
+.subtitle {
+  font-size: 1.2rem;
+  opacity: 0.9;
+  position: relative;
+  z-index: 1;
+}
+
+.ai-features {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 20px;
+  margin-bottom: 30px;
+}
+
+.feature-card {
+  flex: 1 1 300px;
+  background: white;
+  border-radius: 10px;
+  padding: 25px;
+  box-shadow: var(--shadow);
+  transition: transform 0.3s, box-shadow 0.3s;
+  position: relative;
+  overflow: hidden;
+}
+
+.feature-card:hover {
+  transform: translateY(-5px);
+  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
+}
+
+.feature-card::after {
+  content: '';
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 5px;
+  background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
+}
+
+.feature-icon {
+  font-size: 2.5rem;
+  color: var(--primary-color);
+  margin-bottom: 15px;
+}
+
+.feature-title {
+  font-size: 1.3rem;
+  margin-bottom: 10px;
+  color: var(--dark-color);
+}
+
+.feature-desc {
+  color: #666;
+  margin-bottom: 15px;
+}
+
+.btn {
+  display: inline-block;
+  padding: 8px 16px;
+  background: var(--primary-color);
+  color: white;
+  border-radius: 5px;
+  text-decoration: none;
+  transition: background 0.3s;
+  border: none;
+  cursor: pointer;
+  font-size: 0.9rem;
+}
+
+.btn:hover {
+  background: #2980b9;
+}
+
+.btn-outline {
+  background: transparent;
+  border: 1px solid var(--primary-color);
+  color: var(--primary-color);
+}
+
+.btn-outline:hover {
+  background: var(--primary-color);
+  color: white;
+}
+
+.section {
+  margin-bottom: 40px;
+}
+
+.section-title {
+  font-size: 1.8rem;
+  color: var(--dark-color);
+  margin-bottom: 20px;
+  padding-bottom: 10px;
+  border-bottom: 2px solid var(--primary-color);
+  display: inline-block;
+}
+
+.subsection {
+  background: white;
+  border-radius: 10px;
+  padding: 20px;
+  margin-bottom: 20px;
+  box-shadow: var(--shadow);
+}
+
+.subsection-title {
+  font-size: 1.4rem;
+  color: var(--dark-color);
+  margin-bottom: 15px;
+  display: flex;
+  align-items: center;
+}
+
+.subsection-title i {
+  margin-right: 10px;
+  color: var(--primary-color);
+}
+
+/* 知识图谱可视化容器 */
+#knowledge-graph {
+  width: 100%;
+  height: 400px;
+  background: #f9f9f9;
+  border-radius: 8px;
+  margin: 15px 0;
+}
+
+/* AR名片样式 */
+.ar-cards {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 15px;
+  margin-top: 20px;
+}
+
+.ar-card {
+  flex: 1 1 200px;
+  background: linear-gradient(135deg, #f5f7fa, #e4e8eb);
+  border-radius: 8px;
+  padding: 15px;
+  text-align: center;
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+  transition: transform 0.3s;
+}
+
+.ar-card:hover {
+  transform: scale(1.05);
+}
+
+.ar-card-img {
+  width: 80px;
+  height: 80px;
+  border-radius: 50%;
+  object-fit: cover;
+  margin: 0 auto 10px;
+  border: 3px solid var(--primary-color);
+}
+
+.ar-card-name {
+  font-weight: bold;
+  margin-bottom: 5px;
+}
+
+.ar-card-title {
+  color: #666;
+  font-size: 0.9rem;
+  margin-bottom: 10px;
+}
+
+.ar-card-btn {
+  background: var(--secondary-color);
+  color: white;
+  border: none;
+  padding: 5px 10px;
+  border-radius: 4px;
+  font-size: 0.8rem;
+  cursor: pointer;
+}
+
+/* 智能检索区域 */
+.search-container {
+  display: flex;
+  margin: 20px 0;
+}
+
+.search-input {
+  flex: 1;
+  padding: 12px 15px;
+  border: 1px solid #ddd;
+  border-radius: 5px 0 0 5px;
+  font-size: 1rem;
+  outline: none;
+}
+
+.search-btn {
+  padding: 0 20px;
+  background: var(--primary-color);
+  color: white;
+  border: none;
+  border-radius: 0 5px 5px 0;
+  cursor: pointer;
+  transition: background 0.3s;
+}
+
+.search-btn:hover {
+  background: #2980b9;
+}
+
+/* 轮播图样式 */
+.swiper {
+  width: 100%;
+  height: 300px;
+  border-radius: 10px;
+  overflow: hidden;
+  margin: 20px 0;
+  box-shadow: var(--shadow);
+}
+
+.swiper-slide {
+  background-size: cover;
+  background-position: center;
+  display: flex;
+  align-items: flex-end;
+  padding: 30px;
+  color: white;
+  position: relative;
+}
+
+.swiper-slide::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0.3));
+}
+
+.slide-content {
+  position: relative;
+  z-index: 1;
+  max-width: 80%;
+}
+
+.slide-title {
+  font-size: 1.5rem;
+  margin-bottom: 10px;
+}
+
+/* 人才库卡片 */
+.talent-card {
+  display: flex;
+  background: white;
+  border-radius: 8px;
+  overflow: hidden;
+  box-shadow: var(--shadow);
+  margin-bottom: 15px;
+}
+
+.talent-avatar {
+  width: 80px;
+  height: 80px;
+  object-fit: cover;
+}
+
+.talent-info {
+  flex: 1;
+  padding: 15px;
+}
+
+.talent-name {
+  font-weight: bold;
+  margin-bottom: 5px;
+}
+
+.talent-skill {
+  display: inline-block;
+  background: #e0f7fa;
+  color: #00838f;
+  padding: 3px 8px;
+  border-radius: 4px;
+  font-size: 0.8rem;
+  margin-right: 5px;
+  margin-bottom: 5px;
+}
+
+.blockchain-badge {
+  display: inline-flex;
+  align-items: center;
+  background: #f3e5f5;
+  color: #6a1b9a;
+  padding: 3px 8px;
+  border-radius: 4px;
+  font-size: 0.8rem;
+  margin-top: 5px;
+}
+
+.blockchain-badge i {
+  margin-right: 5px;
+}
+
+/* 响应式调整 */
+@media (max-width: 768px) {
+  .ai-features {
+    flex-direction: column;
+  }
+  
+  .feature-card {
+    flex: 1 1 auto;
+  }
+  
+  .ar-cards {
+    flex-direction: column;
+  }
+  
+  .ar-card {
+    flex: 1 1 auto;
+  }
+  
+  .swiper {
+    height: 200px;
+  }
+}

+ 157 - 0
travel-platform-web/travel-web/src/crm/mobile/page-crm-business/page-vibration-monitor.component.ts

@@ -0,0 +1,157 @@
+// page-vibration-monitor.component.ts
+import { Component, AfterViewInit } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { Swiper } from 'swiper';
+import { Navigation, Pagination, Autoplay } from 'swiper/modules';
+import * as echarts from 'echarts';
+
+@Component({
+  selector: 'app-page-vibration-monitor',
+  standalone: true,
+  imports: [CommonModule, FormsModule],
+  templateUrl: './page-vibration-monitor.component.html',
+  styleUrls: ['./page-vibration-monitor.component.scss']
+})
+export class PageVibrationMonitorComponent implements AfterViewInit {
+  searchQuery = '';
+  
+  ngAfterViewInit(): void {
+    this.initKnowledgeGraph();
+    this.initSwiper();
+    this.setupEventListeners();
+    //jia
+    
+  }
+
+  private initKnowledgeGraph(): void {
+    const graphChart = echarts.init(document.getElementById('knowledge-graph'));
+    const graphOption = {
+      title: {
+        text: '协会组织架构知识图谱',
+        subtext: '点击节点查看详细信息',
+        left: 'center'
+      },
+      tooltip: {},
+      legend: {
+        data: ['部门', '人员'],
+        orient: 'vertical',
+        right: 10
+      },
+      series: [{
+        name: '协会组织架构',
+        type: 'graph',
+        layout: 'force',
+        data: [
+          {id: '1', name: '理事会', category: 0, symbolSize: 50},
+          {id: '2', name: '秘书处', category: 0, symbolSize: 40},
+          {id: '3', name: '学术委员会', category: 0, symbolSize: 40},
+          {id: '4', name: '培训部', category: 0, symbolSize: 35},
+          {id: '5', name: '国际交流部', category: 0, symbolSize: 35},
+          {id: '6', name: '张明远', category: 1, symbolSize: 30},
+          {id: '7', name: '李静怡', category: 1, symbolSize: 25},
+          {id: '8', name: '王建国', category: 1, symbolSize: 25},
+          {id: '9', name: '赵雨晴', category: 1, symbolSize: 25},
+          {id: '10', name: '陈教授', category: 1, symbolSize: 20},
+          {id: '11', name: '刘主任', category: 1, symbolSize: 20}
+        ],
+        links: [
+          {source: '1', target: '2'},
+          {source: '1', target: '3'},
+          {source: '1', target: '4'},
+          {source: '1', target: '5'},
+          {source: '6', target: '1'},
+          {source: '7', target: '1'},
+          {source: '8', target: '2'},
+          {source: '9', target: '2'},
+          {source: '10', target: '3'},
+          {source: '11', target: '4'}
+        ],
+        categories: [
+          {name: '部门'},
+          {name: '人员'}
+        ],
+        roam: true,
+        label: {
+          show: true,
+          position: 'right'
+        },
+        force: {
+          repulsion: 100,
+          edgeLength: [50, 100]
+        },
+        emphasis: {
+          focus: 'adjacency',
+          label: {
+            show: true
+          }
+        },
+        lineStyle: {
+          width: 1,
+          curveness: 0.2
+        }
+      }],
+      color: ['#3498db', '#2ecc71']
+    };
+    graphChart.setOption(graphOption);
+
+    window.addEventListener('resize', function() {
+      graphChart.resize();
+    });
+  }
+
+  private initSwiper(): void {
+    new Swiper('.swiper', {
+      modules: [Navigation, Pagination, Autoplay],
+      loop: true,
+      autoplay: {
+        delay: 5000,
+        disableOnInteraction: false,
+      },
+      pagination: {
+        el: '.swiper-pagination',
+        clickable: true,
+      },
+      navigation: {
+        nextEl: '.swiper-button-next',
+        prevEl: '.swiper-button-prev',
+      },
+    });
+  }
+
+  private setupEventListeners(): void {
+    // AR名片按钮点击效果
+    document.querySelectorAll('.ar-card-btn').forEach(btn => {
+      btn.addEventListener('click', (e) => {
+        const target = e.target as HTMLElement;
+        const card = target.closest('.ar-card');
+        if (card) {
+          card.classList.add('animate__animated', 'animate__pulse');
+          setTimeout(() => {
+            card.classList.remove('animate__animated', 'animate__pulse');
+          }, 1000);
+          
+          const name = card.querySelector('.ar-card-name')?.textContent;
+          const title = card.querySelector('.ar-card-title')?.textContent;
+          alert(`请使用手机扫描二维码查看AR名片效果\n\n姓名: ${name}\n职位: ${title}`);
+        }
+      });
+    });
+  }
+
+  onSearch(searchInput: HTMLInputElement, searchBtn: HTMLElement): void {
+    if (searchInput.value.trim() === '') {
+      searchInput.classList.add('animate__animated', 'animate__shakeX');
+      setTimeout(() => {
+        searchInput.classList.remove('animate__animated', 'animate__shakeX');
+      }, 1000);
+    } else {
+      const originalHtml = searchBtn.innerHTML;
+      searchBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i>';
+      setTimeout(() => {
+        searchBtn.innerHTML = originalHtml;
+        alert(`搜索关键词: ${searchInput.value}\n\n模拟搜索功能,实际应用中会显示真实结果`);
+      }, 1000);
+    }
+  }
+}

+ 2 - 0
travel-platform-web/travel-web/src/crm/mobile/page-crm-member/page-crm-member.ts

@@ -12,3 +12,5 @@ import { RouterModule } from '@angular/router';
 export class PageCrmMember {
 
 }
+
+  

+ 431 - 0
travel-platform-web/travel-web/src/lib/ncloud.ts/ncloud.ts

@@ -0,0 +1,431 @@
+// CloudObject.ts
+
+let serverURL = `https://dev.fmode.cn/parse`;
+if (location.protocol == "http:") {
+    serverURL = `http://dev.fmode.cn:1337/parse`;
+}
+
+export class CloudObject {
+    className: string;
+    id: string | undefined = undefined;
+    createdAt: any;
+    updatedAt: any;
+    data: Record<string, any> = {};
+
+    constructor(className: string) {
+        this.className = className;
+    }
+
+    toPointer() {
+        return { "__type": "Pointer", "className": this.className, "objectId": this.id };
+    }
+
+    set(json: Record<string, any>) {
+        Object.keys(json).forEach(key => {
+            if (["objectId", "id", "createdAt", "updatedAt"].indexOf(key) > -1) {
+                return;
+            }
+            this.data[key] = json[key];
+        });
+    }
+
+    get(key: string) {
+        return this.data[key] || null;
+    }
+
+    async save() {
+        let method = "POST";
+        let url = serverURL + `/classes/${this.className}`;
+
+        // 更新
+        if (this.id) {
+            url += `/${this.id}`;
+            method = "PUT";
+        }
+
+        const body = JSON.stringify(this.data);
+        const response = await fetch(url, {
+            headers: {
+                "content-type": "application/json;charset=UTF-8",
+                "x-parse-application-id": "dev"
+            },
+            body: body,
+            method: method,
+            mode: "cors",
+            credentials: "omit"
+        });
+
+        const result = await response?.json();
+        if (result?.error) {
+            console.error(result?.error);
+        }
+        if (result?.objectId) {
+            this.id = result?.objectId;
+        }
+        return this;
+    }
+
+    async destroy() {
+        if (!this.id) return;
+        const response = await fetch(serverURL + `/classes/${this.className}/${this.id}`, {
+            headers: {
+                "x-parse-application-id": "dev"
+            },
+            body: null,
+            method: "DELETE",
+            mode: "cors",
+            credentials: "omit"
+        });
+
+        const result = await response?.json();
+        if (result) {
+            this.id = undefined;
+        }
+        return true;
+    }
+}
+
+// CloudQuery.ts
+export class CloudQuery {
+    className: string;
+    queryParams: Record<string, any> = { where: {} };
+
+    constructor(className: string) {
+        this.className = className;
+    }
+
+    include(...fileds: string[]) {
+        this.queryParams["include"] = fileds;
+    }
+    greaterThan(key: string, value: any) {
+        if (!this.queryParams["where"][key]) this.queryParams["where"][key] = {};
+        this.queryParams["where"][key]["$gt"] = value;
+    }
+
+    greaterThanAndEqualTo(key: string, value: any) {
+        if (!this.queryParams["where"][key]) this.queryParams["where"][key] = {};
+        this.queryParams["where"][key]["$gte"] = value;
+    }
+
+    lessThan(key: string, value: any) {
+        if (!this.queryParams["where"][key]) this.queryParams["where"][key] = {};
+        this.queryParams["where"][key]["$lt"] = value;
+    }
+
+    lessThanAndEqualTo(key: string, value: any) {
+        if (!this.queryParams["where"][key]) this.queryParams["where"][key] = {};
+        this.queryParams["where"][key]["$lte"] = value;
+    }
+
+    equalTo(key: string, value: any) {
+        if (!this.queryParams["where"]) this.queryParams["where"] = {};
+        this.queryParams["where"][key] = value;
+    }
+
+    async get(id: string) {
+        const url = serverURL + `/classes/${this.className}/${id}?`;
+
+        const response = await fetch(url, {
+            headers: {
+                "if-none-match": "W/\"1f0-ghxH2EwTk6Blz0g89ivf2adBDKY\"",
+                "x-parse-application-id": "dev"
+            },
+            body: null,
+            method: "GET",
+            mode: "cors",
+            credentials: "omit"
+        });
+
+        const json = await response?.json();
+        if (json) {
+            let existsObject = this.dataToObj(json)
+            return existsObject;
+        }
+        return null
+    }
+
+    async find(): Promise<Array<CloudObject>> {
+        let url = serverURL + `/classes/${this.className}?`;
+
+        let queryStr = ``
+        Object.keys(this.queryParams).forEach(key => {
+            let paramStr = JSON.stringify(this.queryParams[key]);
+            if (key == "include") {
+                paramStr = this.queryParams[key]?.join(",")
+            }
+            if (queryStr) {
+                url += `${key}=${paramStr}`;
+            } else {
+                url += `&${key}=${paramStr}`;
+            }
+        })
+        // if (Object.keys(this.queryParams["where"]).length) {
+
+        // }
+
+        const response = await fetch(url, {
+            headers: {
+                "if-none-match": "W/\"1f0-ghxH2EwTk6Blz0g89ivf2adBDKY\"",
+                "x-parse-application-id": "dev"
+            },
+            body: null,
+            method: "GET",
+            mode: "cors",
+            credentials: "omit"
+        });
+
+        const json = await response?.json();
+        let list = json?.results || []
+        let objList = list.map((item: any) => this.dataToObj(item))
+        return objList || [];
+    }
+
+
+    async first() {
+        let url = serverURL + `/classes/${this.className}?`;
+
+        if (Object.keys(this.queryParams["where"]).length) {
+            const whereStr = JSON.stringify(this.queryParams["where"]);
+            url += `where=${whereStr}&limit=1`;
+        }
+
+        const response = await fetch(url, {
+            headers: {
+                "if-none-match": "W/\"1f0-ghxH2EwTk6Blz0g89ivf2adBDKY\"",
+                "x-parse-application-id": "dev"
+            },
+            body: null,
+            method: "GET",
+            mode: "cors",
+            credentials: "omit"
+        });
+
+        const json = await response?.json();
+        const exists = json?.results?.[0] || null;
+        if (exists) {
+            let existsObject = this.dataToObj(exists)
+            return existsObject;
+        }
+        return null
+    }
+
+    dataToObj(exists: any): CloudObject {
+        let existsObject = new CloudObject(this.className);
+        Object.keys(exists).forEach(key => {
+            if (exists[key]?.__type == "Object") {
+                exists[key] = this.dataToObj(exists[key])
+            }
+        })
+        existsObject.set(exists);
+        existsObject.id = exists.objectId;
+        existsObject.createdAt = exists.createdAt;
+        existsObject.updatedAt = exists.updatedAt;
+        return existsObject;
+    }
+}
+
+// CloudUser.ts
+export class CloudUser extends CloudObject {
+    constructor() {
+        super("_User"); // 假设用户类在Parse中是"_User"
+        // 读取用户缓存信息
+        let userCacheStr = localStorage.getItem("NCloud/dev/User")
+        if (userCacheStr) {
+            let userData = JSON.parse(userCacheStr)
+            // 设置用户信息
+            this.id = userData?.objectId;
+            this.sessionToken = userData?.sessionToken;
+            this.data = userData; // 保存用户数据
+        }
+    }
+
+    sessionToken: string | null = ""
+    /** 获取当前用户信息 */
+    async current() {
+        if (!this.sessionToken) {
+            console.error("用户未登录");
+            return null;
+        }
+        return this;
+        // const response = await fetch(serverURL + `/users/me`, {
+        //     headers: {
+        //         "x-parse-application-id": "dev",
+        //         "x-parse-session-token": this.sessionToken // 使用sessionToken进行身份验证
+        //     },
+        //     method: "GET"
+        // });
+
+        // const result = await response?.json();
+        // if (result?.error) {
+        //     console.error(result?.error);
+        //     return null;
+        // }
+        // return result;
+    }
+
+    /** 登录 */
+    async login(username: string, password: string): Promise<CloudUser | null> {
+        const response = await fetch(serverURL + `/login`, {
+            headers: {
+                "x-parse-application-id": "dev",
+                "Content-Type": "application/json"
+            },
+            body: JSON.stringify({ username, password }),
+            method: "POST"
+        });
+
+        const result = await response?.json();
+        if (result?.error) {
+            console.error(result?.error);
+            return null;
+        }
+
+        // 设置用户信息
+        this.id = result?.objectId;
+        this.sessionToken = result?.sessionToken;
+        this.data = result; // 保存用户数据
+        // 缓存用户信息
+        console.log(result)
+        localStorage.setItem("NCloud/dev/User", JSON.stringify(result))
+        return this;
+    }
+
+    /** 登出 */
+    async logout() {
+        if (!this.sessionToken) {
+            console.error("用户未登录");
+            return;
+        }
+
+        const response = await fetch(serverURL + `/logout`, {
+            headers: {
+                "x-parse-application-id": "dev",
+                "x-parse-session-token": this.sessionToken
+            },
+            method: "POST"
+        });
+
+        let result = await response?.json();
+
+        if (result?.error) {
+            console.error(result?.error);
+            if (result?.error == "Invalid session token") {
+                this.clearUserCache()
+                return true;
+            }
+            return false;
+        }
+
+        this.clearUserCache()
+        return true;
+    }
+    clearUserCache() {
+        // 清除用户信息
+        localStorage.removeItem("NCloud/dev/User")
+        this.id = undefined;
+        this.sessionToken = null;
+        this.data = {};
+    }
+
+    /** 注册 */
+    async signUp(username: string, password: string, additionalData: Record<string, any> = {}) {
+        const userData = {
+            username,
+            password,
+            ...additionalData // 合并额外的用户数据
+        };
+
+        const response = await fetch(serverURL + `/users`, {
+            headers: {
+                "x-parse-application-id": "dev",
+                "Content-Type": "application/json"
+            },
+            body: JSON.stringify(userData),
+            method: "POST"
+        });
+
+        const result = await response?.json();
+        if (result?.error) {
+            console.error(result?.error);
+            return null;
+        }
+
+        // 设置用户信息
+        // 缓存用户信息
+        console.log(result)
+        localStorage.setItem("NCloud/dev/User", JSON.stringify(result))
+        this.id = result?.objectId;
+        this.sessionToken = result?.sessionToken;
+        this.data = result; // 保存用户数据
+        return this;
+    }
+
+    override async save() {
+        let method = "POST";
+        let url = serverURL + `/users`;
+
+        // 更新用户信息
+        if (this.id) {
+            url += `/${this.id}`;
+            method = "PUT";
+        }
+
+        let data: any = JSON.parse(JSON.stringify(this.data))
+        delete data.createdAt
+        delete data.updatedAt
+        delete data.ACL
+        delete data.objectId
+        const body = JSON.stringify(data);
+        let headersOptions: any = {
+            "content-type": "application/json;charset=UTF-8",
+            "x-parse-application-id": "dev",
+            "x-parse-session-token": this.sessionToken, // 添加sessionToken以进行身份验证
+        }
+        const response = await fetch(url, {
+            headers: headersOptions,
+            body: body,
+            method: method,
+            mode: "cors",
+            credentials: "omit"
+        });
+
+        const result = await response?.json();
+        if (result?.error) {
+            console.error(result?.error);
+        }
+        if (result?.objectId) {
+            this.id = result?.objectId;
+        }
+        localStorage.setItem("NCloud/dev/User", JSON.stringify(this.data))
+        return this;
+    }
+}
+
+export class CloudApi {
+    async fetch(path: string, body: any, options?: {
+        method: string
+        body: any
+    }) {
+
+        let reqOpts: any = {
+            headers: {
+                "x-parse-application-id": "dev",
+                "Content-Type": "application/json"
+            },
+            method: options?.method || "POST",
+            mode: "cors",
+            credentials: "omit"
+        }
+        if (body || options?.body) {
+            reqOpts.body = JSON.stringify(body || options?.body);
+            reqOpts.json = true;
+        }
+        let host = `https://dev.fmode.cn`
+        // host = `http://127.0.0.1:1337`
+        let url = `${host}/api/` + path
+        console.log(url, reqOpts)
+        const response = await fetch(url, reqOpts);
+        let json = await response.json();
+        return json
+    }
+}