Browse Source

feat: new case-parse with find list

RyaneMax 8 months ago
parent
commit
6b83c8b6a7

+ 6 - 3
package-lock.json

@@ -25,10 +25,9 @@
         "@capacitor/keyboard": "6.0.1",
         "@capacitor/status-bar": "6.0.0",
         "@ionic/angular": "^8.0.0",
-        "@types/parse": "^3.0.9",
         "echarts": "^5.5.1",
         "ionicons": "^7.0.0",
-        "parse": "^5.1.0",
+        "parse": "~5.1.0",
         "rxjs": "~7.8.0",
         "swiper": "^11.1.4",
         "tslib": "^2.3.0",
@@ -48,6 +47,7 @@
         "@compodoc/compodoc": "^1.1.25",
         "@ionic/angular-toolkit": "^11.0.1",
         "@types/jasmine": "~5.1.0",
+        "@types/parse": "^3.0.9",
         "@typescript-eslint/eslint-plugin": "^6.0.0",
         "@typescript-eslint/parser": "^6.0.0",
         "eslint": "^8.57.0",
@@ -5910,6 +5910,7 @@
       "version": "20.14.7",
       "resolved": "https://registry.npmmirror.com/@types/node/-/node-20.14.7.tgz",
       "integrity": "sha512-uTr2m2IbJJucF3KUxgnGOZvYbN0QgkGyWxG6973HCpMYFy2KfcgYuIwkJQMQkt1VbBMlvWRbpshFTLxnxCZjKQ==",
+      "dev": true,
       "dependencies": {
         "undici-types": "~5.26.4"
       }
@@ -5927,6 +5928,7 @@
       "version": "3.0.9",
       "resolved": "https://registry.npmmirror.com/@types/parse/-/parse-3.0.9.tgz",
       "integrity": "sha512-DGTHygc7krgmNAK8h42giwmAofCd9uv2++RD+zw6OmWI7AEnlTYZwEuWsx22SA2CSMQrZW8P2INHLpQbnQFUng==",
+      "dev": true,
       "dependencies": {
         "@types/node": "*"
       }
@@ -17430,7 +17432,8 @@
     "node_modules/undici-types": {
       "version": "5.26.5",
       "resolved": "https://registry.npmmirror.com/undici-types/-/undici-types-5.26.5.tgz",
-      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA=="
+      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
+      "dev": true
     },
     "node_modules/unicode-canonical-property-names-ecmascript": {
       "version": "2.0.0",

+ 2 - 2
package.json

@@ -30,10 +30,9 @@
     "@capacitor/keyboard": "6.0.1",
     "@capacitor/status-bar": "6.0.0",
     "@ionic/angular": "^8.0.0",
-    "@types/parse": "^3.0.9",
     "echarts": "^5.5.1",
     "ionicons": "^7.0.0",
-    "parse": "^5.1.0",
+    "parse": "~5.1.0",
     "rxjs": "~7.8.0",
     "swiper": "^11.1.4",
     "tslib": "^2.3.0",
@@ -53,6 +52,7 @@
     "@compodoc/compodoc": "^1.1.25",
     "@ionic/angular-toolkit": "^11.0.1",
     "@types/jasmine": "~5.1.0",
+    "@types/parse": "^3.0.9",
     "@typescript-eslint/eslint-plugin": "^6.0.0",
     "@typescript-eslint/parser": "^6.0.0",
     "eslint": "^8.57.0",

+ 6 - 0
src/app/app-routing.module.ts

@@ -33,12 +33,18 @@ const routes: Routes = [
         path: 'babylon',
         loadChildren: () => import('../modules/study/case-js-module/case-babylon/case-babylon.module').then( m => m.CaseBabylonPageModule)
       },
+      {
+        path: 'parse',
+        loadChildren: () => import('../modules/study/case-js-module/case-parse/case-parse.module').then( m => m.CaseParsePageModule)
+      },
     ]
   },
   {
     path: 'aigc',
     loadChildren: () => import('../modules/aigc/aigc.module').then(m => m.AigcModule)
   },
+  
+
  
 ];
 @NgModule({

+ 1 - 1
src/app/tab1/tab1.page.html

@@ -46,7 +46,7 @@
   <ion-card>
     <ion-card-title>微服务案例</ion-card-title>
     <ion-card-content>
-      <ion-button expand="block" (click)="openGit()">代码:study-ng-contact</ion-button>
+      <ion-button expand="block" routerLink="/study/parse">展示:Pasre微服务</ion-button>
       <ion-button expand="block" routerLink="/tabs/tab2">示例:通讯录列表</ion-button>
       <ion-button expand="block" routerLink="/aigc/chat">示例:AI对话示例</ion-button>
     </ion-card-content>

+ 46 - 0
src/modules/study/case-js-module/case-parse/README.md

@@ -0,0 +1,46 @@
+# Parse JS SDK 使用示例
+
+
+# 安装依赖
+``` bash
+npm i -S parse
+npm i -D @types/parse
+```
+配置 tsconfig.json
+``` json
+  "compilerOptions": {
+    "allowSyntheticDefaultImports": true,
+  }
+```
+
+# 设置微服务地址+参数
+
+``` ts
+// 引用Parse JS SDK
+import Parse from "parse";
+Parse.initialize("dev"); // 设置applicationId
+Parse.serverURL = "http://web2023.fmode.cn:9999/parse"; // 设置serverURL
+
+```
+
+# 实现简单的列表加载
+
+``` html
+<ion-card *ngFor="let pet of petList">
+    {{pet.get("name")}}
+</ion-card>
+```
+
+
+``` ts
+ngOnInit() {
+    this.loadPets()
+  }
+  
+  petList:Array<Parse.Object> = []
+  async loadPets(){
+    let query = new Parse.Query("Pet");
+    let list = await query.find();
+    this.petList = list
+  }
+```

+ 17 - 0
src/modules/study/case-js-module/case-parse/case-parse-routing.module.ts

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

+ 20 - 0
src/modules/study/case-js-module/case-parse/case-parse.module.ts

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

+ 17 - 0
src/modules/study/case-js-module/case-parse/case-parse.page.html

@@ -0,0 +1,17 @@
+<ion-header [translucent]="true">
+  <ion-toolbar>
+    <ion-title>case-parse</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+  <ion-header collapse="condense">
+    <ion-toolbar>
+      <ion-title size="large">case-parse</ion-title>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-card *ngFor="let pet of petList">
+    {{pet.get("name")}}
+  </ion-card>
+</ion-content>

+ 0 - 0
src/modules/study/case-js-module/case-parse/case-parse.page.scss


+ 17 - 0
src/modules/study/case-js-module/case-parse/case-parse.page.spec.ts

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

+ 28 - 0
src/modules/study/case-js-module/case-parse/case-parse.page.ts

@@ -0,0 +1,28 @@
+import { Component, OnInit } from '@angular/core';
+
+// 引用Parse JS SDK
+import Parse from "parse";
+Parse.initialize("dev"); // 设置applicationId
+Parse.serverURL = "http://web2023.fmode.cn:9999/parse"; // 设置serverURL
+
+@Component({
+  selector: 'app-case-parse',
+  templateUrl: './case-parse.page.html',
+  styleUrls: ['./case-parse.page.scss'],
+})
+export class CaseParsePage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+    this.loadPets()
+  }
+  
+  petList:Array<Parse.Object> = []
+  async loadPets(){
+    let query = new Parse.Query("Pet");
+    let list = await query.find();
+    this.petList = list
+  }
+
+}

+ 1 - 0
tsconfig.json

@@ -2,6 +2,7 @@
 {
   "compileOnSave": false,
   "compilerOptions": {
+    "allowSyntheticDefaultImports": true,
     "baseUrl": "./",
     "outDir": "./dist/out-tsc",
     "forceConsistentCasingInFileNames": true,