feat: add tab4 page for login and logout

TFPower-app/src/app/tab4/tab4.page.html

@@ -1,17 +1,51 @@
 <ion-header [translucent]="true">
   <ion-toolbar>
     <ion-title>
-      Tab 4
+      我的
     </ion-title>
   </ion-toolbar>
 </ion-header>
 
 <ion-content [fullscreen]="true">
-  <ion-header collapse="condense">
-    <ion-toolbar>
-      <ion-title size="large">Tab 4</ion-title>
-    </ion-toolbar>
-  </ion-header>
+  <ion-card>
+    <ion-grid [fixed]="true">
+      @if(is_login) {
+      <ion-row>
+        <ion-col size="3" class="center">
+          <ion-avatar>
+            <img [src]="user.avatar" />
+          </ion-avatar>
+        </ion-col>
+        <ion-col size="9">
+          <ion-row class="showusername">{{user.username}}</ion-row>
+          <ion-row class="showdesc">年龄:{{user.age}} 性别:{{user.sex}} 粉丝数:{{user.fans}} 点赞数:{{user.likes}}</ion-row>
+        </ion-col>
+      </ion-row>
+      <ion-card-content>
+        <ion-button expand="block" (click)="updateUser()">修改</ion-button>
+        <ion-button expand="full" (click)="logout()">登出</ion-button>
+      </ion-card-content>
+      }
+      @if(!is_login) {
+      <ion-row>
+        <ion-col size="3" class="center">
+          <ion-avatar>
+            <img src="https://ionicframework.com/docs/img/demos/avatar.svg" />
+          </ion-avatar>
+        </ion-col>
+        <ion-col size="9">
+          <ion-row class="showusername">请登录</ion-row>
+          <ion-row class="showdesc">暂无信息</ion-row>
+        </ion-col>
+      </ion-row>
+      <ion-card-content>
+        <ion-button expand="full" (click)="login()">登录</ion-button>
+        <ion-button expand="full" (click)="register()">注册</ion-button>
+      </ion-card-content>
 
-  <app-explore-container name="Tab 4 page"></app-explore-container>
+      }
+    </ion-grid>
+
+
+  </ion-card>
 </ion-content>

TFPower-app/src/app/tab4/tab4.page.scss

@@ -0,0 +1,16 @@
+ion-avatar {
+  height: 64px;
+  --border-radius: 4px;
+}
+
+.showusername {
+  font-size: 24px;
+  font-weight: 900;
+  margin-bottom: 17px;
+}
+.showdesc {
+}
+
+.center {
+  text-align: center;
+}

TFPower-app/src/app/tab4/tab4.page.ts

@@ -4,8 +4,25 @@ import {
   IonToolbar,
   IonTitle,
   IonContent,
+  IonCard,
+  IonCardContent,
+  IonGrid,
+  IonRow,
+  IonCol,
+  IonAvatar,
+  IonButton,
 } from '@ionic/angular/standalone';
-import { ExploreContainerComponent } from '../explore-container/explore-container.component';
+import { CloudUser } from 'src/lib/cyxncloud';
+interface User {
+  avatar: string;
+  username: string;
+  age: number | null;
+  sex: string;
+  email: string;
+  phoneNumber: string;
+  fans: number;
+  likes: number;
+}
 
 @Component({
   selector: 'app-tab4',
@@ -17,9 +34,69 @@ import { ExploreContainerComponent } from '../explore-container/explore-containe
     IonToolbar,
     IonTitle,
     IonContent,
-    ExploreContainerComponent,
+    IonCard,
+    IonGrid,
+    IonRow,
+    IonCol,
+    IonAvatar,
+    IonCardContent,
+    IonButton,
   ],
 })
 export class Tab4Page {
-  constructor() {}
+  is_login: boolean = false;
+  currentUser: CloudUser | null = null;
+  user: User = {
+    username: '请登录',
+    avatar: 'https://ionicframework.com/docs/img/demos/avatar.svg',
+    age: 0,
+    sex: '-',
+    email: '-',
+    phoneNumber: '-',
+    fans: 0,
+    likes: 0,
+  };
+  constructor() {
+    let userCache = localStorage.getItem('userData');
+    if (userCache) {
+      let userData = JSON.parse(userCache);
+      this.user.avatar = userData.avatar;
+      this.user.username = userData.username;
+      this.user.age = userData.age;
+      this.user.sex = userData.sex;
+      this.user.email = userData.email;
+      this.user.phoneNumber = userData.phoneNumber;
+      this.user.fans = userData.fans;
+      this.user.likes = userData.likes;
+
+      let is_loginCache = localStorage.getItem('is_login');
+      this.is_login = is_loginCache === 'true' ? true : false;
+    }
+  }
+  async login() {
+    this.is_login = true;
+    let user = new CloudUser();
+    this.currentUser = await user.login('cyx', 'cyx123456');
+    if (this.currentUser) {
+      this.user.avatar = this.currentUser.data.avatar;
+      this.user.username = this.currentUser.data.username;
+      this.user.age = this.currentUser.data.age;
+      this.user.sex = this.currentUser.data.sex;
+      this.user.email = this.currentUser.data.email;
+      this.user.phoneNumber = this.currentUser.data.phoneNumber;
+      this.user.fans = this.currentUser.data.fans;
+      this.user.likes = this.currentUser.data.likes;
+      localStorage.setItem('userData', JSON.stringify(this.currentUser.data));
+      localStorage.setItem('is_login', 'true');
+    }
+  }
+  async logout() {
+    this.is_login = false;
+    let user = new CloudUser();
+    let flag = await user.logout();
+    localStorage.removeItem('user');
+    localStorage.removeItem('is_login');
+  }
+  register() {}
+  updateUser() {}
 }

TFPower-app/src/lib/cyxncloud.ts

@@ -0,0 +1,182 @@
+import { remove } from 'ionicons/icons';
+
+export class CloudQuery {
+  className = '';
+  constructor(className: string) {
+    this.className = className;
+  }
+  async getAll() {
+    let response = await fetch(
+      'http://1.94.237.145:1338/parsecyx/classes/' + this.className,
+      {
+        headers: {
+          accept: '*/*',
+          'accept-language':
+            'zh-CN,zh;q=0.9,en;q=0.8,en-GB;q=0.7,en-US;q=0.6,zh-TW;q=0.5,ja;q=0.4',
+          'if-none-match': 'W/"f36-Q0ech+Jn3bu0uYx1n7/k1+XDYr0"',
+          'x-parse-application-id': 'cyx',
+        },
+        referrer: 'http://127.0.0.1:4040/',
+        referrerPolicy: 'strict-origin-when-cross-origin',
+        body: null,
+        method: 'GET',
+        mode: 'cors',
+        credentials: 'omit',
+      }
+    );
+
+    let json = [];
+    if (response) {
+      json = await response.json();
+    }
+    return json || [];
+  }
+
+  async getBy(id: string) {
+    let response = await fetch(
+      'http://1.94.237.145:1338/parsecyx/classes/' + this.className + '/' + id,
+      {
+        headers: {
+          accept: '*/*',
+          'accept-language':
+            'zh-CN,zh;q=0.9,en;q=0.8,en-GB;q=0.7,en-US;q=0.6,zh-TW;q=0.5,ja;q=0.4',
+          'if-none-match': 'W/"f36-Q0ech+Jn3bu0uYx1n7/k1+XDYr0"',
+          'x-parse-application-id': 'cyx',
+        },
+        referrer: 'http://127.0.0.1:4040/',
+        referrerPolicy: 'strict-origin-when-cross-origin',
+        body: null,
+        method: 'GET',
+        mode: 'cors',
+        credentials: 'omit',
+      }
+    );
+
+    let json = {};
+    if (response) {
+      json = await response.json();
+    }
+
+    return json || null;
+  }
+}
+
+// fetch("http://1.94.237.145:1338/parsecyx/classes/_User?", {
+//   headers: {
+//     accept: "*/*",
+//     "accept-language":
+//       "zh-CN,zh;q=0.9,en;q=0.8,en-GB;q=0.7,en-US;q=0.6,zh-TW;q=0.5,ja;q=0.4",
+//     "if-none-match": 'W/"fa-azg+Ndlb0QPHwwjUHnRWOyZVfK8"',
+//     "x-parse-application-id": "cyx",
+//     "x-parse-session-token": "r:59067722e551c61a2146dc890bc4a888",
+//   },
+//   referrer: "http://127.0.0.1:4040/",
+//   referrerPolicy: "strict-origin-when-cross-origin",
+//   body: null,
+//   method: "GET",
+//   mode: "cors",
+//   credentials: "omit",
+// });
+
+// user操作
+export class CloudUser {
+  constructor() {}
+
+  objectId: string = '';
+  sessionToken: string = '';
+  data: any = {};
+
+  // 获取当前用户信息
+  async current() {
+    let url = 'http://1.94.237.145:1338/parsecyx/users/me';
+    return await fetch(url, {
+      method: 'GET',
+      headers: {
+        'X-Parse-Application-Id': 'cyx',
+        'X-Parse-Session-Token': this.sessionToken,
+      },
+    })
+      .then((response) => {
+        if (!response.ok) {
+          throw new Error('Invalid session token');
+        }
+        return response.json();
+      })
+      .then((data) => data)
+      .catch((error) => {
+        console.error('Error fetching user data:', error);
+        throw error;
+      });
+  }
+
+  // 用户登录
+  async login(username: string, password: string): Promise<CloudUser | null> {
+    let url = `http://1.94.237.145:1338/parsecyx/login`;
+    const response = await fetch(url, {
+      method: 'POST',
+      headers: {
+        'X-Parse-Application-Id': 'cyx',
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({ username, password }),
+    });
+
+    const result = await response?.json();
+    if (result?.error) {
+      console.error(result?.error);
+      return null;
+    }
+
+    this.objectId = result.objectId;
+    this.sessionToken = result.sessionToken;
+    this.data = result.data;
+    return this;
+  }
+
+  // 用户登出
+  async logout(): Promise<boolean> {
+    let url = 'http://1.94.237.145:1338/parsecyx/logout';
+    const response = await fetch(url, {
+      method: 'POST',
+      headers: {
+        'X-Parse-Application-Id': 'cyx',
+        'X-Parse-Session-Token': this.sessionToken,
+      },
+    });
+
+    this.objectId = '';
+    this.sessionToken = '';
+    this.data = {};
+    return true;
+  }
+
+  // 用户注册
+  async register(username: string, password: string, phone: string) {
+    let url = 'http://1.94.237.145:1338/parsecyx/users';
+    return await fetch(url, {
+      method: 'POST',
+      headers: {
+        'X-Parse-Application-Id': 'cyx',
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({ username, password, phone }),
+    })
+      .then((response) => {
+        if (!response.ok) {
+          throw new Error('Registration failed');
+        }
+        return response.json();
+      })
+      .then((data) => {
+        this.objectId = data.objectId;
+        this.sessionToken = data.sessionToken;
+        this.data = data;
+      })
+      .catch((error) => {
+        console.error('Error registering user:', error);
+        throw error;
+      });
+  }
+}
+// module.exports.Query = Query;
+// module.exports.CloudUser = CloudUser;

TFPower-server/migration/import-data.js

@@ -1,15 +1,26 @@
-const { Query } = require("./lib/ncloud");
+const { Query, Insert } = require("./lib/ncloud");
 
 async function main() {
-  let news = "News";
-  let newsQuery = new Query(news);
-  // let newslists = await newsQuery.getAll();
-  // for (let i = 0; i < newslists.length; i++) {
-  //   console.log(newslists[i]);
-  // }
-  let id = "xwOWEOLD13";
-  let one = await newsQuery.getBy(id);
-  console.log(one);
+  // let news = "News";
+  // let newsQuery = new Query(news);
+  // // let newslists = await newsQuery.getAll();
+  // // for (let i = 0; i < newslists.length; i++) {
+  // //   console.log(newslists[i]);
+  // // }
+  // let id = "xwOWEOLD13";
+  // let one = await newsQuery.getBy(id);
+  // console.log(one);
+  let userInfo = {
+    username: "test",
+    password: "test",
+    email: "test@example.com",
+    phoneNumber: "1234567890",
+    sex: "Male",
+  };
+
+  // 创建用户
+  let insert = new Insert("User");
+  insert.addUser(userInfo);
 }
 
 main();

TFPower-server/migration/lib/cyxncloud.ts

@@ -0,0 +1,181 @@
+export class CloudQuery {
+  className = "";
+  constructor(className) {
+    this.className = className;
+  }
+  async getAll() {
+    let response = await fetch(
+      "http://1.94.237.145:1338/parsecyx/classes/" + this.className,
+      {
+        headers: {
+          accept: "*/*",
+          "accept-language":
+            "zh-CN,zh;q=0.9,en;q=0.8,en-GB;q=0.7,en-US;q=0.6,zh-TW;q=0.5,ja;q=0.4",
+          "if-none-match": 'W/"f36-Q0ech+Jn3bu0uYx1n7/k1+XDYr0"',
+          "x-parse-application-id": "cyx",
+        },
+        referrer: "http://127.0.0.1:4040/",
+        referrerPolicy: "strict-origin-when-cross-origin",
+        body: null,
+        method: "GET",
+        mode: "cors",
+        credentials: "omit",
+      }
+    );
+
+    let json = [];
+    if (response) {
+      json = await response.json();
+    }
+    return json || [];
+  }
+
+  async getBy(id) {
+    let response = await fetch(
+      "http://1.94.237.145:1338/parsecyx/classes/" + this.className + "/" + id,
+      {
+        headers: {
+          accept: "*/*",
+          "accept-language":
+            "zh-CN,zh;q=0.9,en;q=0.8,en-GB;q=0.7,en-US;q=0.6,zh-TW;q=0.5,ja;q=0.4",
+          "if-none-match": 'W/"f36-Q0ech+Jn3bu0uYx1n7/k1+XDYr0"',
+          "x-parse-application-id": "cyx",
+        },
+        referrer: "http://127.0.0.1:4040/",
+        referrerPolicy: "strict-origin-when-cross-origin",
+        body: null,
+        method: "GET",
+        mode: "cors",
+        credentials: "omit",
+      }
+    );
+
+    let json = {};
+    if (response) {
+      json = await response.json();
+    }
+
+    return json || null;
+  }
+}
+
+// fetch("http://1.94.237.145:1338/parsecyx/classes/_User?", {
+//   headers: {
+//     accept: "*/*",
+//     "accept-language":
+//       "zh-CN,zh;q=0.9,en;q=0.8,en-GB;q=0.7,en-US;q=0.6,zh-TW;q=0.5,ja;q=0.4",
+//     "if-none-match": 'W/"fa-azg+Ndlb0QPHwwjUHnRWOyZVfK8"',
+//     "x-parse-application-id": "cyx",
+//     "x-parse-session-token": "r:59067722e551c61a2146dc890bc4a888",
+//   },
+//   referrer: "http://127.0.0.1:4040/",
+//   referrerPolicy: "strict-origin-when-cross-origin",
+//   body: null,
+//   method: "GET",
+//   mode: "cors",
+//   credentials: "omit",
+// });
+
+// user操作
+export class CloudUser {
+  constructor() {}
+
+  objectId: string = "";
+  sessionToken: string = "";
+  data: Record<string, any> = {};
+
+  // 获取当前用户信息
+  async current() {
+    let url = "http://1.94.237.145:1338/parsecyx/users/me";
+    let response = await fetch(url, {
+      method: "GET",
+      headers: {
+        "X-Parse-Application-Id": "cyx",
+        "X-Parse-Session-Token": this.sessionToken,
+      },
+    });
+    return response.json();
+  }
+
+  // 用户登录
+  async login(username: string, password: string): Promise<CloudUser | null> {
+    const response = await fetch(`http://1.94.237.145:1338/parsecyx/login`, {
+      method: "POST",
+      headers: {
+        "X-Parse-Application-Id": "cyx",
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({ username, password }),
+    });
+
+    const result = await response?.json();
+    if (result?.error) {
+      console.error(result?.error);
+      return null;
+    }
+
+    // 设置用户信息
+    this.objectId = result.objectId;
+    this.sessionToken = result.sessionToken;
+    this.data = result; // 保存用户数据
+    // 缓存用户信息
+    // localStorage.setItem("NCloud/dev/User", JSON.stringify(result));
+    return this;
+  }
+
+  // 用户登出
+  async logout() {
+    let url = "http://1.94.237.145:1338/parsecyx/logout";
+    return await fetch(url, {
+      method: "POST",
+      headers: {
+        "X-Parse-Application-Id": "cyx",
+        "X-Parse-Session-Token": this.sessionToken,
+      },
+    })
+      .then((response) => {
+        if (!response.ok) {
+          throw new Error("Logout failed");
+        }
+        return response.json();
+      })
+      .then(() => {
+        this.sessionToken = "";
+        this.objectId = "";
+        this.data = {};
+        console.log("User logged out successfully");
+      })
+      .catch((error) => {
+        console.error("Error logging out:", error);
+        throw error;
+      });
+  }
+
+  // 用户注册
+  async register(username, password, phone) {
+    let url = "http://1.94.237.145:1338/parsecyx/users";
+    return await fetch(url, {
+      method: "POST",
+      headers: {
+        "X-Parse-Application-Id": "cyx",
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({ username, password, phone }),
+    })
+      .then((response) => {
+        if (!response.ok) {
+          throw new Error("Registration failed");
+        }
+        return response.json();
+      })
+      .then((data) => {
+        this.objectId = data.objectId;
+        this.sessionToken = data.sessionToken;
+        this.data = data;
+      })
+      .catch((error) => {
+        console.error("Error registering user:", error);
+        throw error;
+      });
+  }
+}

TFPower-server/migration/lib/ncloud.js

@@ -1,89 +0,0 @@
-class Query {
-  className = "";
-  constructor(className) {
-    this.className = className;
-  }
-  async getAll() {
-    let response = await fetch(
-      "http://1.94.237.145:1338/parsecyx/classes/" + this.className,
-      {
-        headers: {
-          accept: "*/*",
-          "accept-language":
-            "zh-CN,zh;q=0.9,en;q=0.8,en-GB;q=0.7,en-US;q=0.6,zh-TW;q=0.5,ja;q=0.4",
-          "if-none-match": 'W/"f36-Q0ech+Jn3bu0uYx1n7/k1+XDYr0"',
-          "x-parse-application-id": "cyx",
-        },
-        referrer: "http://127.0.0.1:4040/",
-        referrerPolicy: "strict-origin-when-cross-origin",
-        body: null,
-        method: "GET",
-        mode: "cors",
-        credentials: "omit",
-      }
-    );
-
-    let json = [];
-    if (response) {
-      json = await response.json();
-    }
-    return json.results || [];
-  }
-
-  async getBy(id) {
-    let response = await fetch(
-      "http://1.94.237.145:1338/parsecyx/classes/" + this.className + "/" + id,
-      {
-        headers: {
-          accept: "*/*",
-          "accept-language":
-            "zh-CN,zh;q=0.9,en;q=0.8,en-GB;q=0.7,en-US;q=0.6,zh-TW;q=0.5,ja;q=0.4",
-          "if-none-match": 'W/"f36-Q0ech+Jn3bu0uYx1n7/k1+XDYr0"',
-          "x-parse-application-id": "cyx",
-        },
-        referrer: "http://127.0.0.1:4040/",
-        referrerPolicy: "strict-origin-when-cross-origin",
-        body: null,
-        method: "GET",
-        mode: "cors",
-        credentials: "omit",
-      }
-    );
-
-    let json = {};
-    if (response) {
-      json = await response.json();
-    }
-
-    return json || null;
-  }
-}
-
-class Insert {
-  className = "";
-  constructor(className) {
-    this.className = className;
-  }
-  async addUser(info) {
-    if (info.username) {
-      method = "";
-    }
-    let body = JSON.stringify(info);
-    let response = await fetch("http://1.94.237.145:1338/parsecyx/users", {
-      headers: {
-        accept: "*/*",
-        "accept-language":
-          "zh-CN,zh;q=0.9,en;q=0.8,en-GB;q=0.7,en-US;q=0.6,zh-TW;q=0.5,ja;q=0.4",
-        "content-type": "text/plain",
-      },
-      referrer: "http://127.0.0.1:4040/",
-      referrerPolicy: "strict-origin-when-cross-origin",
-      // body: '{"username":"test","password":"test","email":"test@qq.com","phoneNumber":"10086","sex":"男","age":"18","_ApplicationId":"cyx","_ClientVersion":"js3.4.2","_MasterKey":"cyxmk","_InstallationId":"111053ea-8bfc-4dfc-8818-df34dd45d6b0"}',
-      body: body,
-      method: method,
-      mode: "cors",
-      credentials: "omit",
-    });
-  }
-}
-module.exports.Query = Query;