Initial commit

.gitignore

@@ -0,0 +1,52 @@
+# See http://help.github.com/ignore-files/ for more about ignoring files.
+
+# Compiled output
+/dist
+/tmp
+/out-tsc
+/bazel-out
+
+# Node
+/front/node_modules
+npm-debug.log
+yarn-error.log
+
+# front
+.angular/
+
+#backend
+__pycache__/
+
+
+# IDEs and editors
+.idea/
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# Visual Studio Code
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# Miscellaneous
+/.angular/cache
+.sass-cache/
+/connect.lock
+/coverage
+/libpeerconnection.log
+testem.log
+/typings
+
+# System files
+.DS_Store
+Thumbs.db
+
+# Project exclude paths
+/front/dist/

backend/__init__.py

@@ -0,0 +1,5 @@
+# -*- coding: utf-8 -*-
+# @Time    :2022/11/13 8:50
+# @Author  :lzh
+# @File    : __init__.py
+# @Software: PyCharm

backend/app.py

@@ -0,0 +1,31 @@
+import time
+import traceback
+from flask import Flask
+from flask_cors import CORS
+import config as db
+from views.user import user
+from views.games import game
+from views.reviews import review
+from utils import read_dataset
+from utils import init_admin
+
+
+if __name__ == '__main__':
+    # 如果数据库为空，则读取数据集并存入数据库
+    try:
+        if not db.get_db():
+            read_dataset()
+        init_admin()
+        time.sleep(1)
+        app = Flask(__name__)
+        CORS(app, supports_credentials=True)
+        app.config.from_object(db)
+        app.config['JSON_AS_ASCII'] = False
+        app.register_blueprint(user, url_prefix="/")
+        app.register_blueprint(game, url_prefix="/")
+        app.register_blueprint(review, url_prefix="/")
+        app.config["SECRET_KEY"] = 'game dataset'
+        # app.run(debug=True)
+        app.run(host='127.0.0.1', port=5000, debug=True)
+    except Exception:
+        traceback.print_exc()

backend/config.py

@@ -0,0 +1,25 @@
+import pymongo
+
+# Azure Cosmos DB connection string
+cosmos_db_uri = "mongodb://games:oQ5bO7YMfpu99oZMpKs0fjjypybyIMwBHJh7TmK8FYj1J41StnByDp1vxZ0huSXxlYbNLiRtNdvZACDb9cByMQ==@games.mongo.cosmos.azure.com:10255/?ssl=true&retrywrites=false&replicaSet=globaldb&maxIdleTimeMS=120000&appName=@games@"
+
+# Create a MongoClient
+client = pymongo.MongoClient(cosmos_db_uri)
+DATABASE_NAME = "games"
+COLLECTION = "games"
+USER_COLLECTION = "user"
+DATASET_PATH = "dataset/games.csv"
+
+
+def get_user_collection():
+    return client[DATABASE_NAME]["user"]
+
+
+def get_db():
+    try:
+        _collection = client[DATABASE_NAME]
+        is_exist = _collection[COLLECTION].count_documents({})
+        print(f"{COLLECTION} is exist: {is_exist}")
+        return is_exist != 0
+    except Exception as e:
+        raise e

backend/utils.py

@@ -0,0 +1,54 @@
+# -*- coding: utf-8 -*-
+import json
+import bson
+import base64
+import random
+import pandas
+import time
+from config import client, DATASET_PATH, DATABASE_NAME, COLLECTION, USER_COLLECTION
+
+
+class JSONEncoder(json.JSONEncoder):
+    def default(self, o):
+        if isinstance(o, bson.ObjectId):
+            return str(o)
+        return json.JSONEncoder.default(self, o)
+
+
+def get_token(user_id):
+    token = base64.b64encode(
+        (".".join([str(user_id), str(random.random()), str(time.time() + 7200)])).encode()).decode()
+    return token
+
+
+def verify_token(token):
+    _token = base64.b64decode(token).decode()
+    user_id, random_num, expire_time = _token.split(".")
+    if float(expire_time) > time.time():
+        return True, user_id
+    else:
+        # token is expired
+        return False, user_id
+
+
+def read_dataset():
+    data = pandas.read_csv(DATASET_PATH,encoding='gbk')
+    data = data.fillna("")
+    data = data.to_dict(orient="records")
+    database = client[DATABASE_NAME]
+    list_data = []
+    for item in data:
+        list_data.append(item)
+    database[COLLECTION].insert_many(list_data)
+    return data
+
+def init_admin():
+    database = client[DATABASE_NAME]
+    dbUser = database[USER_COLLECTION]
+    admin = dbUser.find_one({"username": "admin", "password": "123456"})
+    if not admin:
+        admin = {"username": "admin", "password": "123456"}
+        dbUser.insert_one(admin)
+
+if __name__ == '__main__':
+    print(read_dataset()[0])

backend/views/__init__.py

@@ -0,0 +1,5 @@
+# -*- coding: utf-8 -*-
+# @Time    :2023/11/19 14:21
+# @Author  :lzh
+# @File    : __init__.py
+# @Software: PyCharm

backend/views/games.py

@@ -0,0 +1,132 @@
+import time
+import datetime
+import traceback
+from bson import ObjectId
+from config import client, DATABASE_NAME, COLLECTION, USER_COLLECTION
+from utils import JSONEncoder
+from flask import Blueprint, request, jsonify, Response
+
+game = Blueprint('game', __name__);
+user_collection = client[DATABASE_NAME][USER_COLLECTION]
+game_collection = client[DATABASE_NAME][COLLECTION]
+
+
+@game.route('/api/v1/game/getGames', methods=['POST', 'GET'])
+def game_list():
+    try:
+        page = request.json.get("page", 1)
+        size = request.json.get("size", 10)
+
+        # 获取查询参数
+        original_price = request.json.get("Original Price")
+        title = request.json.get("Title")
+        developer = request.json.get("Developer")
+        game_features = request.json.get("Game Features")
+
+        # 构建查询条件
+        query_conditions = {}
+        # 不区分大小写的模糊查询
+        if original_price:
+            query_conditions["Original Price"] = {"$regex": original_price, "$options": "i"}
+        if title:
+            query_conditions["Title"] = {"$regex": title, "$options": "i"}
+        if developer:
+            query_conditions["Developer"] = {"$regex": developer, "$options": "i"}
+        # 匹配列表中所有元素
+        if game_features:
+            query_conditions["Game Features"] = {"$all": game_features}
+
+        # 执行查询
+        data = game_collection.find(query_conditions).skip((page - 1) * size).limit(size).sort("update_time", -1)
+        res = []
+        for i in data:
+            res.append(i)
+        total = game_collection.count_documents(query_conditions)
+        content = {"code": 200, "total": total, "data": res, "msg": "SUCCESS"}
+        content = JSONEncoder().encode(content)
+    except Exception as e:
+        content = {"code": 500, "msg": str(e)}
+
+    return Response(content, mimetype='application/json')
+
+
+@game.route('/api/v1/game/addGame', methods=['POST', 'GET'])
+def add_game():
+    try:
+        game_data = request.json
+        # Title为必填项
+        if not game_data.get("Title"):
+            return jsonify({"code": 500, "msg": "Field: [Title] is required"}), 400
+        existing_game = game_collection.find_one({"Title": game_data.get("Title")})
+        if existing_game:
+            return jsonify({
+                "code": 500,
+                "msg": f"A game with the same title [{existing_game}] already exists"}
+            ), 400
+
+        # 验证字符串类型的字段
+        string_fields = ["Title", "Original Price", "Discounted Price", "Release Date", "Game Description", "Developer", "Publisher" ]
+        for field in string_fields:
+            if not isinstance(game_data.get(field), str):
+                return jsonify({"code": 500, "msg": f"Field:[{field}] should be a string"}), 400
+
+        # 验证列表类型的字段
+        # list_fields = ["Popular Tags", "Game Features", "Supported Languages"]
+        # for field in list_fields:
+        #     if not isinstance(game_data.get(field), list):
+        #         return jsonify({"code": 500, "msg": f"Field: [{field}] should be a list"}), 400
+
+        # 添加时间戳
+        game_data["date_added"] = datetime.datetime.now().strftime("%Y-%m-%d")
+        game_data["update_time"] = time.time()
+
+        # 插入数据
+        game_collection.insert_one(game_data)
+        return jsonify({"code": 200, "msg": "SUCCESS"})
+    except Exception as e:
+        return jsonify({"code": 500, "msg": str(e)}), 500
+
+
+@game.route('/api/v1/game/deleteGame', methods=['POST', 'GET'])
+def delete_game():
+    try:
+        id = request.json.get("_id")
+        game_collection.delete_one({"_id": ObjectId(id)})
+        content = {"code": 200, "msg": "SUCCESS"}
+    except Exception as e:
+        import traceback
+        traceback.print_exc()
+        content = {"code": 500, "msg": str(e)}
+    return JSONEncoder().encode(content)
+
+
+@game.route('/api/v1/game/updateGame', methods=['POST', 'GET'])
+def update_game():
+    try:
+        id = request.json.pop("_id")
+        game_collection.update_one({"_id": ObjectId(id)}, {"$set": request.json})
+        content = {"code": 200, "msg": "SUCCESS"}
+    except Exception as e:
+        traceback.print_exc()
+        content = {"code": 500, "msg": str(e)}
+    return JSONEncoder().encode(content)
+
+
+# 获取收藏列表
+@game.route('/api/v1/game/getCollectList', methods=['POST', 'GET'])
+def get_collect_list():
+    try:
+        username = request.json.get("username")
+        user_document = user_collection.find_one({"username": username})
+        game_ids = user_document.get("collect", [])
+        collect_list = []
+        # 批量查询game_ids
+        for game_id in game_ids:
+            game_document = game_collection.find_one({"_id": ObjectId(game_id)})
+            collect_list.append(game_document)
+        content = {"code": 200, "msg": "SUCCESS", "total": len(game_ids), "data": collect_list}
+    except Exception as e:
+        traceback.print_exc()
+        content = {"code": 500, "msg": str(e)}
+    content = JSONEncoder().encode(content)
+    return Response(content, mimetype='application/json')

backend/views/reviews.py

@@ -0,0 +1,62 @@
+import uuid
+import time
+import datetime
+from bson import ObjectId
+from flask import Blueprint, request, jsonify
+from config import client, DATABASE_NAME, COLLECTION
+
+review = Blueprint('review', __name__)
+game_collection = client[DATABASE_NAME][COLLECTION]
+
+
+@review.route('/api/v1/addReview', methods=['POST'])
+def add_review():
+    try:
+        game_id = request.json.get('_id')
+        username = request.json.get('username')
+        content = request.json.get('review')
+        format_now = datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S')
+        review_document = {
+            "review_id": str(uuid.uuid1()),
+            "username": username,
+            "review": content,
+            "update_time": format_now,
+            "timestamp": int(time.time())
+        }
+        game_collection.update_one(
+            {"_id": ObjectId(game_id)},
+            {"$push": {"reviews": review_document}}
+        )
+        content = {"code": 200, "msg": "SUCCESS", "data": {"update_time": format_now}}
+    except Exception as e:
+        content = {"code": 500, "msg": str(e)}
+    return jsonify(content)
+
+
+@review.route('/api/v1/getReviews', methods=['POST'])
+def get_reviews():
+    try:
+        game_id = request.json.get('gameId')
+        game_document = game_collection.find_one({"_id": ObjectId(game_id)}, {"reviews": 500})
+        reviews = game_document.get("reviews", [])
+        reviews.sort(key=lambda x: x["timestamp"], reverse=True)
+        content = {"code": 200, "msg": "SUCCESS", "data": reviews}
+    except Exception as e:
+        content = {"code": 500, "msg": str(e)}
+    return jsonify(content)
+
+
+@review.route('api/v1/deleteReview', methods=['POST'])
+def remove_review():
+    try:
+        game_id = request.json.get('gameId')
+        review_id = request.json.get('review_id')
+        game_collection.update_one(
+            {"_id": ObjectId(game_id)},
+            {"$pull": {"reviews": {"review_id": review_id}}}
+        )
+        content = {"code": 200, "msg": "SUCCESS"}
+    except Exception as e:
+        content = {"code": 500, "msg": str(e)}
+    return jsonify(content)
+

backend/views/user.py

@@ -0,0 +1,77 @@
+import json
+import traceback
+from flask import Blueprint, request, jsonify
+from utils import get_token
+from config import client, DATABASE_NAME, USER_COLLECTION
+
+db = client[DATABASE_NAME]
+dbUser = db["user"]
+user = Blueprint('user', __name__)
+user_collection = client[DATABASE_NAME][USER_COLLECTION]
+
+
+@user.route('/api/v1/games/login', methods=['POST'])
+def login():
+    username = request.json.get('username')
+    password = request.json.get('password')
+    # 登录校验
+    try:
+        login_user = dbUser.find_one({"username": username, "password": password})
+        if login_user:
+            token = get_token(login_user.get("username"))
+            content = {"code": 200, "msg": "SUCCESS",
+                       "data": {"token": token}}
+        else:
+            content = {"code": 500, "msg": "username or password is wrong!"}
+    except Exception as e:
+        import traceback
+        traceback.print_exc()
+        content = {"code": 500, "msg": str(e)}
+    return jsonify(content)
+
+
+@user.route('/api/v1/games/register', methods=['POST'])
+def register():
+    try:
+        username = request.json.get('username')
+        password = request.json.get('password')
+        # 校验是否已经注册
+        regist_user = dbUser.find_one({"username": username, "password": password})
+        if not regist_user:
+            regist_user = {"username": username, "password": password}
+            dbUser.insert_one(regist_user)
+            content = {"code": 200, "msg": "SUCCESS"}
+        else:
+            content = {"code": 500, "msg": "Register failed! The username already exists!!"}
+    except Exception as e:
+        traceback.print_exc()
+        content = {"code": 500, "msg": str(e)}
+    return jsonify(content)
+
+
+# 收藏游戏
+@user.route('/api/v1/games/collectGame', methods=['POST', 'GET'])
+def collect_game():
+    try:
+        username = request.json.get("username")
+        game_id = request.json.get("gameId")
+        user_collection.update_one({"username": username}, {"$addToSet": {"collect": game_id}})
+        content = {"code": 200, "msg": "SUCCESS"}
+    except Exception as e:
+        traceback.print_exc()
+        content = {"code": 500, "msg": str(e)}
+    return jsonify(content)
+
+
+# 取消收藏
+@user.route('/api/v1/games/cancelCollectGame', methods=['POST', 'GET'])
+def cancel_collect_game():
+    try:
+        username = request.json.get("username")
+        game_id = request.json.get("gameId")
+        user_collection.update_one({"username": username}, {"$pull": {"collect": game_id}})
+        content = {"code": 200, "msg": "SUCCESS"}
+    except Exception as e:
+        traceback.print_exc()
+        content = {"code": 500, "msg": str(e)}
+    return jsonify(content)

front/.browserslistrc

@@ -0,0 +1,16 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR

front/.editorconfig

@@ -0,0 +1,16 @@
+# Editor configuration, see https://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.ts]
+quote_type = single
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

front/angular.json

@@ -0,0 +1,112 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "ng_front": {
+      "projectType": "application",
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss"
+        }
+      },
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist/ng_front",
+            "index": "src/index.html",
+            "main": "src/main.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "tsconfig.app.json",
+            "inlineStyleLanguage": "scss",
+            "assets": [
+              "src/favicon.ico",
+              "src/assets",
+              {
+                "glob": "**/*",
+                "input": "./node_modules/@ant-design/icons-angular/src/inline-svg/",
+                "output": "/assets/"
+              }
+            ],
+            "styles": [
+              "src/theme.less",
+              "src/styles.scss",
+              "node_modules/ng-zorro-antd/ng-zorro-antd.min.css"
+            ],
+            "scripts": []
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "500kb",
+                  "maximumError": "1mb"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "2kb",
+                  "maximumError": "4kb"
+                }
+              ],
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "buildOptimizer": false,
+              "optimization": false,
+              "vendorChunk": true,
+              "extractLicenses": false,
+              "sourceMap": true,
+              "namedChunks": true
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "configurations": {
+            "production": {
+              "browserTarget": "ng_front:build:production"
+            },
+            "development": {
+              "browserTarget": "ng_front:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "ng_front:build"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "src/test.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "tsconfig.spec.json",
+            "karmaConfig": "karma.conf.js",
+            "inlineStyleLanguage": "scss",
+            "assets": ["src/favicon.ico", "src/assets"],
+            "styles": ["src/styles.scss"],
+            "scripts": []
+          }
+        }
+      }
+    }
+  },
+  "cli": {
+    "analytics": "24da8ee6-8259-4a0c-af26-6229ddc5476e"
+  }
+}

front/karma.conf.js

@@ -0,0 +1,44 @@
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/1.0/config/configuration-file.html
+
+module.exports = function (config) {
+  config.set({
+    basePath: '',
+    frameworks: ['jasmine', '@angular-devkit/build-angular'],
+    plugins: [
+      require('karma-jasmine'),
+      require('karma-chrome-launcher'),
+      require('karma-jasmine-html-reporter'),
+      require('karma-coverage'),
+      require('@angular-devkit/build-angular/plugins/karma')
+    ],
+    client: {
+      jasmine: {
+        // you can add configuration options for Jasmine here
+        // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
+        // for example, you can disable the random execution with `random: false`
+        // or set a specific seed with `seed: 4321`
+      },
+      clearContext: false // leave Jasmine Spec Runner output visible in browser
+    },
+    jasmineHtmlReporter: {
+      suppressAll: true // removes the duplicated traces
+    },
+    coverageReporter: {
+      dir: require('path').join(__dirname, './coverage/ng_front'),
+      subdir: '.',
+      reporters: [
+        { type: 'html' },
+        { type: 'text-summary' }
+      ]
+    },
+    reporters: ['progress', 'kjhtml'],
+    port: 9876,
+    colors: true,
+    logLevel: config.LOG_INFO,
+    autoWatch: true,
+    browsers: ['Chrome'],
+    singleRun: false,
+    restartOnFileChange: true
+  });
+};

front/package.json

@@ -0,0 +1,39 @@
+{
+  "name": "ng-front",
+  "version": "0.0.0",
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve",
+    "build": "ng build",
+    "watch": "ng build --watch --configuration development",
+    "test": "ng test"
+  },
+  "private": true,
+  "dependencies": {
+    "@angular/animations": "^14.2.0",
+    "@angular/common": "^14.2.0",
+    "@angular/compiler": "^14.2.0",
+    "@angular/core": "^14.2.0",
+    "@angular/forms": "^14.2.0",
+    "@angular/platform-browser": "^14.2.0",
+    "@angular/platform-browser-dynamic": "^14.2.0",
+    "@angular/router": "^14.2.0",
+    "ng-zorro-antd": "^14.2.1",
+    "rxjs": "~7.5.0",
+    "tslib": "^2.3.0",
+    "zone.js": "~0.11.4"
+  },
+  "devDependencies": {
+    "@angular-devkit/build-angular": "^14.2.9",
+    "@angular/cli": "~14.2.9",
+    "@angular/compiler-cli": "^14.2.0",
+    "@types/jasmine": "~4.0.0",
+    "jasmine-core": "~4.3.0",
+    "karma": "~6.4.0",
+    "karma-chrome-launcher": "~3.1.0",
+    "karma-coverage": "~2.2.0",
+    "karma-jasmine": "~5.1.0",
+    "karma-jasmine-html-reporter": "~2.0.0",
+    "typescript": "~4.7.2"
+  }
+}

front/src/app/app-routing.module.ts

@@ -0,0 +1,26 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { LoginComponent } from './pages/login/login.component';
+import { PageNotFoundComponent } from './pages/pageNotFound.component';
+
+const routes: Routes = [
+  { path: '', pathMatch: 'full', redirectTo: '/login' },
+  {
+    path: 'login',
+    loadChildren: () =>
+      import('./pages/login/login.module').then((m) => m.LoginModule),
+  },
+  {
+    path: 'layout',
+    loadChildren: () =>
+      import('./pages/layout/layout.module').then((m) => m.LayoutModule),
+  },
+  { path: '**', component: PageNotFoundComponent }, // Wildcard route for a 404 page
+];
+
+@NgModule({
+  imports: [RouterModule.forRoot(routes)],
+  exports: [RouterModule],
+})
+export class AppRoutingModule {}

front/src/app/app.component.html

@@ -0,0 +1 @@
+<router-outlet></router-outlet>

front/src/app/app.component.scss

@@ -0,0 +1,26 @@
+$baseColor: #d98410;
+::ng-deep .ant-btn-primary,
+::ng-deep .ant-btn-primary:focus,
+::ng-deep .ant-btn-primary:hover {
+  border-color: $baseColor;
+  background: $baseColor;
+}
+::ng-deep .ant-btn:focus,
+::ng-deep .ant-btn:hover {
+  border-color: $baseColor;
+  color: $baseColor;
+}
+::ng-deep .ant-menu.ant-menu-dark .ant-menu-item-selected,
+::ng-deep .ant-menu-dark.ant-menu-horizontal > .ant-menu-item:hover {
+  background-color: $baseColor;
+  background-color: $baseColor;
+}
+::ng-deep .ant-pagination-item-active,
+::ng-deep .ant-pagination-item-active:hover,
+::ng-deep .ant-pagination-item:hover {
+  border-color: $baseColor;
+}
+::ng-deep .ant-pagination-item-active a,
+::ng-deep .ant-pagination-item:hover a {
+  color: $baseColor;
+}

front/src/app/app.component.spec.ts

@@ -0,0 +1,35 @@
+import { TestBed } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { AppComponent } from './app.component';
+
+describe('AppComponent', () => {
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [
+        RouterTestingModule
+      ],
+      declarations: [
+        AppComponent
+      ],
+    }).compileComponents();
+  });
+
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app).toBeTruthy();
+  });
+
+  it(`should have as title 'ng_front'`, () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app.title).toEqual('ng_front');
+  });
+
+  it('should render title', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    fixture.detectChanges();
+    const compiled = fixture.nativeElement as HTMLElement;
+    expect(compiled.querySelector('.content span')?.textContent).toContain('ng_front app is running!');
+  });
+});

front/src/app/app.component.ts

@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-root',
+  templateUrl: './app.component.html',
+  styleUrls: ['./app.component.scss'],
+})
+export class AppComponent {
+  isCollapsed = false;
+}

front/src/app/app.module.ts

@@ -0,0 +1,41 @@
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+
+import { AppRoutingModule } from './app-routing.module';
+import { AppComponent } from './app.component';
+import { NZ_I18N, zh_CN, en_US } from 'ng-zorro-antd/i18n';
+import { registerLocaleData } from '@angular/common';
+import zh from '@angular/common/locales/zh';
+import { ReactiveFormsModule, FormsModule } from '@angular/forms';
+import { HttpClientModule, HttpClient } from '@angular/common/http';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { IconsProviderModule } from './icons-provider.module';
+import { NzLayoutModule } from 'ng-zorro-antd/layout';
+import { NzMenuModule } from 'ng-zorro-antd/menu';
+import { NzBreadCrumbModule } from 'ng-zorro-antd/breadcrumb';
+import { NzMessageService } from 'ng-zorro-antd/message';
+
+registerLocaleData(zh);
+
+@NgModule({
+  declarations: [AppComponent],
+  imports: [
+    BrowserModule,
+    AppRoutingModule,
+    FormsModule,
+    ReactiveFormsModule,
+    HttpClientModule,
+    BrowserAnimationsModule,
+    IconsProviderModule,
+    NzLayoutModule,
+    NzMenuModule,
+    NzBreadCrumbModule,
+  ],
+  providers: [
+    { provide: NZ_I18N, useValue: en_US },
+    NzMessageService,
+    HttpClient,
+  ],
+  bootstrap: [AppComponent],
+})
+export class AppModule {}

front/src/app/icons-provider.module.ts

@@ -0,0 +1,21 @@
+import { NgModule } from '@angular/core';
+import { NZ_ICONS, NzIconModule } from 'ng-zorro-antd/icon';
+
+import {
+  MenuFoldOutline,
+  MenuUnfoldOutline,
+  FormOutline,
+  DashboardOutline
+} from '@ant-design/icons-angular/icons';
+
+const icons = [MenuFoldOutline, MenuUnfoldOutline, DashboardOutline, FormOutline];
+
+@NgModule({
+  imports: [NzIconModule],
+  exports: [NzIconModule],
+  providers: [
+    { provide: NZ_ICONS, useValue: icons }
+  ]
+})
+export class IconsProviderModule {
+}

front/src/app/pages/layout/favorite/favorite.component.html

@@ -0,0 +1,36 @@
+<nz-table #basicTable [nzData]="favoriteList" [nzLoading]="loading">
+  <thead>
+    <tr>
+      <th></th>
+      <th>Title</th>
+      <th>Release Date</th>
+      <th>Publisher</th>
+      <th>Game Description</th>
+      <th>Action</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr *ngFor="let data of basicTable.data">
+      <td>{{ data.idx + 1 }}</td>
+      <td>
+        <img
+          style="width: 50px; height: 50px; margin-right: 20px"
+          src="https://img2.baidu.com/it/u=2253673318,3372600971&fm=253&fmt=auto&app=138&f=JPEG?w=528&h=500"
+        />
+        {{ data.Title }}
+      </td>
+      <td>{{ data["Release Date"] }}</td>
+      <td>{{ data.Publisher }}</td>
+      <td>{{ data["Game Description"] }}</td>
+      <td>
+        <span
+          nz-icon
+          nzType="heart"
+          nzTheme="outline"
+          (click)="deleteCollect(data)"
+          style="cursor: pointer"
+        ></span>
+      </td>
+    </tr>
+  </tbody>
+</nz-table>

front/src/app/pages/layout/favorite/favorite.component.scss

@@ -0,0 +1,6 @@
+.music-search {
+  width: 500px;
+  margin: 0 auto;
+  display: block;
+  margin-bottom: 30px;
+}

front/src/app/pages/layout/favorite/favorite.component.ts

@@ -0,0 +1,58 @@
+import { Component, OnInit } from '@angular/core';
+import { NzMessageService } from 'ng-zorro-antd/message';
+import { NavigateService } from 'src/app/services/navigate.service';
+import { ApiService } from 'src/app/services/api.service';
+
+@Component({
+  selector: 'app-favorite',
+  templateUrl: './favorite.component.html',
+  styleUrls: ['./favorite.component.scss'],
+})
+export class FavoriteComponent implements OnInit {
+  favoriteList: any = [];
+  loading: boolean = true;
+  constructor(
+    private apiService: ApiService,
+    private $message: NzMessageService,
+    private navigateService: NavigateService
+  ) {}
+
+  ngOnInit() {
+    this.getFavoriteList();
+  }
+  deleteCollect(data: any) {
+    let params = {
+      username: localStorage.getItem('username'),
+      gameId: data._id,
+    };
+    this.apiService.post('/games/cancelCollectGame', params).subscribe(
+      (res: any) => {
+        this.getFavoriteList();
+        this.$message.success('已取消收藏');
+      },
+      () => {}
+    );
+  }
+  getFavoriteList() {
+    this.apiService
+      .post('/game/getCollectList', { username: localStorage.getItem('username') })
+      .subscribe(
+        (res: any) => {
+          console.log(res);
+          const { code, data } = res;
+          if (code == 200) {
+            this.loading = false;
+            this.favoriteList = data;
+            this.favoriteList.forEach((item: any, index: number) => {
+              item.idx = index;
+            });
+          } else {
+            this.favoriteList = [];
+          }
+        },
+        () => {
+          this.loading = false;
+        }
+      );
+  }
+}

front/src/app/pages/layout/favorite/favorite.module.ts

@@ -0,0 +1,22 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RouterModule } from '@angular/router';
+import { SharedModule } from '../../../shared/shared.module';
+import { FavoriteComponent } from './favorite.component';
+// import {FormatTimePipe} from "../../../pipe/formatTime.pipe";
+
+@NgModule({
+  imports: [
+    CommonModule,
+    SharedModule,
+    RouterModule.forChild([
+      {
+        path: '',
+        component: FavoriteComponent,
+      },
+    ]),
+  ],
+  declarations: [FavoriteComponent],
+  exports: [FavoriteComponent],
+})
+export class FavoriteModule {}

front/src/app/pages/layout/game-details/game-details.component.html

@@ -0,0 +1,146 @@
+<button
+  nz-button
+  nzType="default"
+  nzSize="small"
+  style="float: left"
+  routerLink="/layout/list"
+>
+  < Back
+</button>
+<h1 class="song-title">- {{ gameInfo.Title }} -</h1>
+<div class="song-info">
+  <img
+    style="width: 200px; height: 200px"
+    src="https://img2.baidu.com/it/u=2253673318,3372600971&fm=253&fmt=auto&app=138&f=JPEG?w=528&h=500"
+  />
+  <div class="song-info-basic">
+    <div class="title">
+      {{ gameInfo.Title
+      }}<span
+        nz-icon
+        nzType="heart"
+        nzTheme="outline"
+        (click)="onCollect()"
+        style="color: red; margin-left: 20px; cursor: pointer"
+      ></span>
+      <span style="float: right">
+        <span
+          *ngIf="isAdmin"
+          nz-icon
+          nzType="delete"
+          nzTheme="outline"
+          (click)="onDelete()"
+          [style]="{ marginRight: '10px', cursor: 'pointer' }"
+        ></span>
+        <span
+          *ngIf="isAdmin"
+          nz-icon
+          nzType="edit"
+          nzTheme="outline"
+          (click)="onEdit()"
+          [style]="{ marginRight: '10px', cursor: 'pointer' }"
+        ></span
+      ></span>
+    </div>
+    <div>
+      Original Price:
+      <span
+        style="
+          text-decoration: line-through;
+          text-decoration-color: red;
+          color: red;
+        "
+        >{{ gameInfo["Original Price"] }}</span
+      >
+    </div>
+    <div>
+      Discounted Price:
+      <span style="color: green">{{ gameInfo["Discounted Price"] }}</span>
+    </div>
+    <div>Developer: {{ gameInfo.Developer }}</div>
+    <div>Publisher: {{ gameInfo.Publisher }}</div>
+    <div>Release Date: {{ gameInfo["Release Date"] }}</div>
+    <div>Game Description: {{ gameInfo["Game Description"] }}</div>
+  </div>
+</div>
+<h2 style="margin-top: 20px; border-bottom: 1px solid #eee">Comments</h2>
+<nz-list
+  [nzDataSource]="commentList"
+  [nzRenderItem]="item"
+  [nzItemLayout]="'horizontal'"
+>
+  <ng-template #item let-item>
+    <nz-comment [nzAuthor]="item.username" [nzDatetime]="item.update_time">
+      <nz-avatar
+        nz-comment-avatar
+        nzIcon="user"
+        [nzSrc]="item.avatar"
+      ></nz-avatar>
+      <nz-comment-content>
+        <p>{{ item.review }}</p>
+        <i
+          *ngIf="isAdmin"
+          nz-icon
+          nzType="delete"
+          nzTheme="outline"
+          (click)="removeComment(item)"
+          style="cursor: pointer"
+        ></i>
+      </nz-comment-content>
+    </nz-comment>
+  </ng-template>
+</nz-list>
+<h3 style="margin-top: 20px">add comment</h3>
+<nz-comment>
+  <nz-avatar nz-comment-avatar nzIcon="user" [nzSrc]=""></nz-avatar>
+  <nz-comment-content>
+    <nz-form-item>
+      <textarea [(ngModel)]="commentValue" nz-input rows="4"></textarea>
+    </nz-form-item>
+    <nz-form-item>
+      <button
+        nz-button
+        nzType="primary"
+        [nzLoading]="submitting"
+        [disabled]="!commentValue"
+        (click)="handleSubmit()"
+      >
+        Add Comment
+      </button>
+    </nz-form-item>
+  </nz-comment-content>
+</nz-comment>
+<nz-modal
+  [(nzVisible)]="isVisible"
+  nzTitle="Edit Game"
+  nzOkText="Ok"
+  nzCancelText="Cancel"
+  (nzOnOk)="submitForm()"
+  (nzOnCancel)="isVisible = false"
+>
+  <ng-container *nzModalContent>
+    <form nz-form [formGroup]="editForm">
+      <div nz-row [nzGutter]="24">
+        <div nz-col [nzSpan]="24" *ngFor="let field of editField">
+          <nz-form-item>
+            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="name"
+              >{{ field.label }}
+            </nz-form-label>
+            <nz-form-control
+              [nzSm]="14"
+              [nzXs]="24"
+              [nzErrorTip]="'Please input ' + field.label!"
+            >
+              <input
+                nz-input
+                [formControlName]="field.value"
+                id="name"
+                [placeholder]="field.label"
+              />
+            </nz-form-control>
+          </nz-form-item>
+        </div>
+      </div>
+    </form>
+  </ng-container>
+</nz-modal>

front/src/app/pages/layout/game-details/game-details.component.scss

@@ -0,0 +1,31 @@
+.song-title {
+  text-align: center;
+  font-weight: bolder;
+  padding-bottom: 20px;
+  margin-bottom: 30px;
+  border-bottom: 1px solid #eee;
+}
+.song-info {
+  display: flex;
+  text-align: left;
+}
+.song-info-basic {
+  margin-left: 20px;
+}
+.song-info-basic > div {
+  line-height: 26px;
+}
+.title {
+  font-weight: bold;
+  font-size: 24px;
+  margin: 8px 0;
+}
+.song-info-basic > div {
+  &:first-child {
+    color: #000;
+    font-weight: bold;
+    font-size: 24px;
+  }
+  font-size: 14px;
+  color: #333;
+}

front/src/app/pages/layout/game-details/game-details.component.ts

@@ -0,0 +1,176 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { ApiService } from 'src/app/services/api.service';
+import { NzMessageService } from 'ng-zorro-antd/message';
+import { NavigateService } from 'src/app/services/navigate.service';
+import { Router } from '@angular/router';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+@Component({
+  selector: 'app-game-details',
+  templateUrl: './game-details.component.html',
+  styleUrls: ['./game-details.component.scss'],
+})
+export class GameDetailsComponent implements OnInit {
+  gameInfo: any = {};
+  commentList: any = [];
+  fps: any = '';
+  editForm!: FormGroup;
+  editField: any = [
+    {
+      label: 'Title',
+      value: 'Title',
+    },
+    {
+      label: 'Original Price',
+      value: 'Original Price',
+    },
+    {
+      label: 'Discounted Price',
+      value: 'Discounted Price',
+    },
+    {
+      label: 'Developer',
+      value: 'Developer',
+    },
+    {
+      label: 'Publisher',
+      value: 'Publisher',
+    },
+    {
+      label: 'Release Date',
+      value: 'Release Date',
+    },
+    {
+      label: 'Game Description',
+      value: 'Game Description',
+    },
+  ];
+  isVisible: boolean = false;
+  isAdmin: boolean = false; // Indicates if the user is an admin
+
+  constructor(
+    private route: ActivatedRoute,
+    private apiService: ApiService,
+    private $message: NzMessageService,
+    private navigateService: NavigateService,
+    public router: Router,
+    private fb: FormBuilder
+  ) {}
+
+  ngOnInit(): void {
+    this.isAdmin = localStorage.getItem('username') == 'admin';
+    this.gameInfo = JSON.parse(localStorage.getItem('gameInfo') as any);
+    this.editForm = this.fb.group({
+      Title: [null, [Validators.required]],
+      'Original Price': [null, [Validators.required]],
+      'Discounted Price': [null, [Validators.required]],
+      Developer: [null, [Validators.required]],
+      Publisher: [null, [Validators.required]],
+      'Release Date': [null, [Validators.required]],
+      'Game Description': [null, [Validators.required]],
+    });
+    this.getCommentList();
+  }
+
+  getCommentList(): void {
+    this.apiService
+      .post('/getReviews', {
+        gameId: this.gameInfo._id,
+      })
+      .subscribe(
+        (res: any) => {
+          const { code, data } = res;
+          if (code == 200) {
+            this.commentList = data;
+            this.submitting = false;
+          }
+        },
+        () => {}
+      );
+  }
+
+  submitting = false;
+  commentValue = '';
+
+  handleSubmit(): void {
+    this.submitting = true;
+
+    let params = {
+      username: localStorage.getItem('username'),
+      review: this.commentValue,
+      _id: this.gameInfo._id,
+    };
+    this.apiService.post('/addReview', params).subscribe(
+      (res: any) => {
+        this.commentValue = '';
+        this.getCommentList();
+      },
+      () => {}
+    );
+  }
+
+  removeComment(comment: any): void {
+    this.submitting = true;
+    let params = {
+      review_id: comment.review_id,
+      gameId: this.gameInfo._id,
+    };
+    this.apiService.post('/deleteReview', params).subscribe(
+      (res: any) => {
+        this.commentValue = '';
+        this.getCommentList();
+      },
+      () => {}
+    );
+  }
+
+  onCollect() {
+    let params = {
+      username: localStorage.getItem('username'),
+      gameId: this.gameInfo._id,
+    };
+    this.apiService.post('/games/collectGame', params).subscribe(
+      (res: any) => {
+        this.$message.success('collected!');
+        this.router.navigate(['/layout/favorite'], {});
+      },
+      () => {}
+    );
+  }
+
+  onDelete() {
+    this.apiService
+      .post('/game/deleteGame', { _id: this.gameInfo._id })
+      .subscribe(
+        (res: any) => {
+          this.$message.success(`delete ${this.gameInfo.title} success!`);
+          this.router.navigate(['/layout/list'], {});
+        },
+        () => {}
+      );
+  }
+  onEdit() {
+    this.isVisible = true;
+    this.editForm.patchValue(this.gameInfo);
+  }
+  submitForm(): void {
+    if (this.editForm.valid) {
+      let params = { ...this.editForm.value, _id: this.gameInfo._id };
+      this.apiService.post('/game/updateGame', params).subscribe(
+        (res: any) => {
+          this.isVisible = false;
+          this.$message.success(`edit success!`);
+          this.router.navigate(['/layout/list'], {});
+        },
+        () => {}
+      );
+    } else {
+      Object.values(this.editForm.controls).forEach((control: any) => {
+        if (control.invalid) {
+          control.markAsDirty();
+          control.updateValueAndValidity({ onlySelf: true });
+        }
+      });
+    }
+  }
+}

front/src/app/pages/layout/game-details/game-details.module.ts

@@ -0,0 +1,22 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RouterModule } from '@angular/router';
+import { SharedModule } from '../../../shared/shared.module';
+import { GameDetailsComponent } from './game-details.component';
+// import {FormatTimePipe} from "../../../pipe/formatTime.pipe";
+
+@NgModule({
+  imports: [
+    CommonModule,
+    SharedModule,
+    RouterModule.forChild([
+      {
+        path: '',
+        component: GameDetailsComponent,
+      },
+    ]),
+  ],
+  declarations: [GameDetailsComponent],
+  exports: [GameDetailsComponent],
+})
+export class GameDetailsModule {}

front/src/app/pages/layout/layout-routing.module.ts

@@ -0,0 +1,38 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { LayoutComponent } from './layout.component';
+import { GameDetailsComponent } from './game-details/game-details.component';
+import { ListComponent } from './list/list.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: LayoutComponent,
+    children: [
+      { path: '', redirectTo: 'list', pathMatch: 'full' },
+      {
+        path: 'list',
+        loadChildren: () =>
+          import('./list/list.module').then((m) => m.ListModule),
+      },
+      {
+        path: 'game-details',
+        loadChildren: () =>
+          import('./game-details/game-details.module').then(
+            (m) => m.GameDetailsModule
+          ),
+      },
+      {
+        path: 'favorite',
+        loadChildren: () =>
+          import('./favorite/favorite.module').then((m) => m.FavoriteModule),
+      },
+    ],
+  },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class LayoutRoutingModule {}

front/src/app/pages/layout/layout.component.html

@@ -0,0 +1,25 @@
+<div class="layout">
+  <nz-layout>
+    <nz-header>
+      <div class="logo">Game App</div>
+      <ul nz-menu nzTheme="dark" nzMode="inline" nzMode="horizontal">
+        <li nz-menu-item nzMatchRouter>
+          <a routerLink="/layout/list">Game Toplist</a>
+        </li>
+        <li nz-menu-item nzMatchRouter>
+          <a routerLink="/layout/favorite">Favorite</a>
+        </li>
+      </ul>
+      <span class="right-top-tool"
+        >{{ username
+        }}<span routerLink="/login" class="sign">sign out</span></span
+      >
+    </nz-header>
+    <nz-content>
+      <div class="inner-content">
+        <router-outlet></router-outlet>
+      </div>
+    </nz-content>
+    <nz-footer>Game App ©2023 Implement By me</nz-footer>
+  </nz-layout>
+</div>

front/src/app/pages/layout/layout.component.scss

@@ -0,0 +1,136 @@
+$baseColor: #d98410;
+::ng-deep .ant-menu-dark.ant-menu-horizontal > .ant-menu-item {
+  padding: 0 40px;
+  font-size: 20px;
+}
+.ant-layout {
+  height: 100%;
+}
+
+::ng-deep
+  .ant-menu-dark.ant-menu-dark:not(.ant-menu-horizontal)
+  .ant-menu-item-selected {
+  background-color: $baseColor;
+}
+.layout {
+  width: 100%;
+}
+:host {
+  height: 100%;
+  display: flex;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.app-layout {
+  height: 100vh;
+}
+.ant-layout-content {
+  min-height: auto;
+}
+
+.menu-sidebar {
+  position: relative;
+  z-index: 10;
+  min-height: 100vh;
+  box-shadow: 2px 0 6px rgba(0, 21, 41, 0.35);
+}
+
+.header-trigger {
+  height: 64px;
+  padding: 20px 24px;
+  font-size: 20px;
+  cursor: pointer;
+  transition: all 0.3s, padding 0s;
+}
+
+.trigger:hover {
+  color: $baseColor;
+}
+
+.sidebar-logo h1 {
+  display: inline-block;
+  margin: 0 0 0 20px;
+  color: #fff;
+  font-weight: 600;
+  font-size: 14px;
+  font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
+  vertical-align: middle;
+}
+
+.app-header {
+  position: relative;
+  height: 64px;
+  padding: 0;
+  background: #fff;
+  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+}
+
+.inner-content {
+  padding: 24px;
+  background: #fff;
+  height: 100%;
+  min-height: 360px;
+}
+
+.logo {
+  width: 180px;
+  height: 64px;
+  line-height: 64px;
+  color: #fff;
+  padding: 0 20px;
+  float: left;
+  font-size: 20px;
+  font-weight: bold;
+}
+
+nz-header {
+  padding: 0;
+  width: 100%;
+  z-index: 2;
+}
+
+nz-breadcrumb {
+  margin: 16px 0;
+}
+
+nz-header {
+  padding: 0;
+  width: 100%;
+  z-index: 2;
+}
+
+nz-footer {
+  text-align: center;
+}
+
+
+.menu-ul {
+  display: flex;
+  justify-content: center;
+}
+
+.right-top-tool {
+  position: absolute;
+  top: 0;
+  right: 50px;
+  line-height: 60px;
+  height: 40px;
+  color: #fff;
+}
+
+.sign {
+  margin-left: 20px;
+  color: $baseColor;
+  cursor: pointer;
+}
+.sign:hover {
+  color: #fff;
+}
+
+.inner-content {
+  background: #fff;
+  padding: 24px;
+  // min-height: 280px;
+}

front/src/app/pages/layout/layout.component.ts

@@ -0,0 +1,16 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-layout',
+  templateUrl: './layout.component.html',
+  styleUrls: ['./layout.component.scss'],
+})
+export class LayoutComponent implements OnInit {
+  username: any = '';
+  isCollapsed = false;
+  constructor() {}
+
+  ngOnInit() {
+    this.username = localStorage.getItem('username');
+  }
+}

front/src/app/pages/layout/layout.module.ts

@@ -0,0 +1,22 @@
+import { NgModule } from '@angular/core';
+
+import { LayoutRoutingModule } from './layout-routing.module';
+
+import { LayoutComponent } from './layout.component';
+import { NzLayoutModule } from 'ng-zorro-antd/layout';
+import { NzMenuModule } from 'ng-zorro-antd/menu';
+import { NzBreadCrumbModule } from 'ng-zorro-antd/breadcrumb';
+import { NzDropDownModule } from 'ng-zorro-antd/dropdown';
+
+@NgModule({
+  imports: [
+    LayoutRoutingModule,
+    NzLayoutModule,
+    NzMenuModule,
+    NzBreadCrumbModule,
+    NzDropDownModule,
+  ],
+  declarations: [LayoutComponent],
+  exports: [LayoutComponent],
+})
+export class LayoutModule {}

front/src/app/pages/layout/list/list.component.html

@@ -0,0 +1,164 @@
+<!-- Form for searching items -->
+<form
+  nz-form
+  nzLayout="inline"
+  [formGroup]="searchQueryForm"
+  (ngSubmit)="getGameList()"
+>
+  <div nz-row>
+    <div
+      nz-col
+      nzSpan="8"
+      *ngFor="let field of searchQueryFields"
+      style="margin: 20px 0"
+    >
+      <nz-form-item>
+        <nz-form-label>{{ field.label }}</nz-form-label>
+        <nz-form-control [nzErrorTip]="'Please input ' + field.label!">
+          <!-- Select input for type field -->
+          <nz-select
+            *ngIf="field.value == 'type'"
+            [ngModel]="field.value"
+            [nzPlaceHolder]="field.label"
+            [formControlName]="field.value"
+          >
+            <nz-option
+              *ngFor="let item of categoryOptions"
+              [nzValue]="item.value"
+              [nzLabel]="item.label"
+            ></nz-option>
+          </nz-select>
+          <!-- Text input for other fields -->
+          <input
+            *ngIf="field.value != 'type'"
+            nz-input
+            [formControlName]="field.value"
+            [placeholder]="field.label"
+          />
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div nz-col nzSpan="8" style="margin-top: 20px">
+      <button nz-button nzType="primary">Search</button>
+      <!-- Button to open the modal for adding a new game -->
+      <button
+        *ngIf="isAdmin"
+        nz-button
+        nzType="default"
+        (click)="isModalVisible = true"
+        style="margin-left: 15px"
+      >
+        <i nz-icon nzType="plus" nzTheme="outline"></i>Add Game
+      </button>
+    </div>
+  </div>
+</form>
+
+<!-- Display of items with a loading spinner -->
+<div style="padding: 5px 30px">
+  <nz-spin [nzSpinning]="isLoading">
+    <!-- Updated variable for loading state -->
+    <div nz-row [nzGutter]="50">
+      <!-- Loop to display each game item -->
+      <div
+        nz-col
+        [nzSpan]="4"
+        *ngFor="let data of itemList"
+        class="card-shadow"
+        style="margin-bottom: 40px; position: relative; padding: 20px 10px"
+      >
+        <!-- Image and details of each game -->
+        <img
+          style="
+            width: 100%;
+            height: 150px;
+            cursor: pointer;
+            border-radius: 8px;
+          "
+          src="https://img2.baidu.com/it/u=2253673318,3372600971&fm=253&fmt=auto&app=138&f=JPEG?w=528&h=500"
+          (click)="toDetail(data)"
+        />
+        <span
+          style="
+            position: absolute;
+            left: 35px;
+            top: 135px;
+            color: red;
+            font-weight: bold;
+          "
+          >{{ data["Discounted Price"] }}</span
+        >
+        <div
+          style="
+            font-weight: bold;
+            font-size: 16px;
+            margin: 2px 0;
+            overflow: hidden;
+            height: 25px;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+          "
+        >
+          {{ data.Title }}
+        </div>
+        <div
+          [title]="data['Game Description']"
+          style="
+            display: -webkit-box;
+            -webkit-line-clamp: 2;
+            -webkit-box-orient: vertical;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: normal;
+          "
+        >
+          {{ data["Game Description"] }}
+        </div>
+      </div>
+    </div>
+  </nz-spin>
+  <!-- Pagination control -->
+  <nz-pagination
+    [nzPageIndex]="currentPage"
+    [nzTotal]="totalItems"
+    nzShowSizeChanger
+    [nzPageSize]="pageSize"
+    (nzPageIndexChange)="pageChange($event)"
+    (nzPageSizeChange)="pageSizeChange($event)"
+    style="text-align: right"
+  ></nz-pagination>
+</div>
+<nz-modal
+  [(nzVisible)]="isModalVisible"
+  nzTitle="Add Movie"
+  nzOkText="Ok"
+  nzCancelText="Cancel"
+  (nzOnOk)="submitForm()"
+  (nzOnCancel)="isModalVisible = false"
+>
+  <ng-container *nzModalContent>
+    <form nz-form [formGroup]="createForm">
+      <div nz-row [nzGutter]="24">
+        <div nz-col [nzSpan]="24" *ngFor="let field of createFormFields">
+          <nz-form-item>
+            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="name"
+              >{{ field.label }}
+            </nz-form-label>
+            <nz-form-control
+              [nzSm]="14"
+              [nzXs]="24"
+              [nzErrorTip]="'Please input ' + field.label!"
+            >
+              <input
+                nz-input
+                [formControlName]="field.value"
+                id="name"
+                [placeholder]="field.label"
+              />
+            </nz-form-control>
+          </nz-form-item>
+        </div>
+      </div>
+    </form>
+  </ng-container>
+</nz-modal>

front/src/app/pages/layout/list/list.component.scss

@@ -0,0 +1,14 @@
+$baseColor: #d98410;
+.game-search {
+  width: 500px;
+  margin: 0 auto;
+  display: block;
+  margin-bottom: 30px;
+}
+a {
+  color: #99a1c8;
+}
+.card-shadow:hover {
+  box-shadow: 0 1px 2px -2px #00000029, 0 3px 6px #0000001f,
+    0 5px 12px 4px #00000017;
+}

front/src/app/pages/layout/list/list.component.ts

@@ -0,0 +1,200 @@
+import { Component, OnInit } from '@angular/core';
+import { NzMessageService } from 'ng-zorro-antd/message';
+import { NavigateService } from 'src/app/services/navigate.service';
+import { ApiService } from 'src/app/services/api.service';
+import { Router } from '@angular/router';
+import { NzModalService } from 'ng-zorro-antd/modal';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+
+// Main component for listing items
+@Component({
+  selector: 'app-list',
+  templateUrl: './list.component.html',
+  styleUrls: ['./list.component.scss'],
+})
+export class ListComponent implements OnInit {
+  itemList: any = []; // Stores the list of items (games, TV shows, etc.)
+  isLoading: boolean = true; // Indicates if data is being loaded
+  isModalVisible: boolean = false; // Controls visibility of modal
+  createForm!: FormGroup; // Form for adding new items
+  createFormFields: any = [
+    {
+      label: 'Title',
+      value: 'Title',
+    },
+    {
+      label: 'Original Price',
+      value: 'Original Price',
+    },
+    {
+      label: 'Discounted Price',
+      value: 'Discounted Price',
+    },
+    {
+      label: 'Developer',
+      value: 'Developer',
+    },
+    {
+      label: 'Publisher',
+      value: 'Publisher',
+    },
+    {
+      label: 'Release Date',
+      value: 'Release Date',
+    },
+    {
+      label: 'Game Description',
+      value: 'Game Description',
+    },
+  ];
+  currentPage: number = 1; // Current page number for pagination
+  pageSize: number = 18; // Number of items per page
+  totalItems: number = 10; // Total number of items available
+  searchQueryForm!: FormGroup; // Form for searching items
+  searchQueryFields: any = [
+    {
+      label: 'Title',
+      value: 'Title',
+    },
+    {
+      label: 'Developer',
+      value: 'Developer',
+    },
+  ];
+  categoryOptions: any = [
+    {
+      label: 'Game',
+      value: 'Game',
+    },
+    {
+      label: 'TV Show',
+      value: 'TV Show',
+    },
+    {
+      label: 'all',
+      value: 'all',
+    },
+  ];
+  isAdmin: boolean = false; // Indicates if the user is an admin
+
+  // Constructor with necessary service injections
+  constructor(
+    private apiService: ApiService,
+    private messageService: NzMessageService,
+    private navigateService: NavigateService,
+    public router: Router,
+    private modalService: NzModalService,
+    private formBuilder: FormBuilder
+  ) {}
+
+  // OnInit lifecycle hook to initialize forms and fetch initial data
+  ngOnInit() {
+    this.isAdmin = localStorage.getItem('username') == 'admin';
+    this.initializeCreateForm();
+    this.initializeSearchForm();
+    this.getGameList();
+  }
+
+  // Initialize the form for creating new items
+  initializeCreateForm() {
+    this.createForm = this.formBuilder.group({
+      // Form controls with validators
+      Title: [null, [Validators.required]],
+      'Original Price': [null, [Validators.required]],
+      'Discounted Price': [null, [Validators.required]],
+      Developer: [null, [Validators.required]],
+      Publisher: [null, [Validators.required]],
+      'Release Date': [null, [Validators.required]],
+      'Game Description': [null, [Validators.required]],
+    });
+  }
+
+  // Initialize the search form
+  initializeSearchForm() {
+    this.searchQueryForm = this.formBuilder.group({
+      // Form controls for search
+      Title: [null],
+      Developer: [null],
+    });
+  }
+
+  // Submit the create form
+  submitForm(): void {
+    if (this.createForm.valid) {
+      let params = { ...this.createForm.value };
+      this.apiService.post('/game/addGame', params).subscribe(
+        (res: any) => {
+          this.isModalVisible = false;
+          this.getGameList();
+          this.messageService.success(`add success!`);
+        },
+        () => {
+          // Error handling
+        }
+      );
+    } else {
+      // Handling form validation
+      Object.values(this.createForm.controls).forEach((control) => {
+        if (control.invalid) {
+          control.markAsDirty();
+          control.updateValueAndValidity({ onlySelf: true });
+        }
+      });
+    }
+  }
+
+  // Trigger search
+  onSearch() {
+    this.currentPage = 1;
+    this.pageSize = 18;
+    this.getGameList();
+  }
+
+  // Navigate to the detail page of an item
+  toDetail(data: any) {
+    localStorage.setItem('gameInfo', JSON.stringify(data));
+    this.router.navigate(['/layout/game-details']);
+  }
+
+  // Fetch the list of items
+  getGameList() {
+    let params = {
+      page: this.currentPage,
+      size: this.pageSize,
+      ...this.searchQueryForm.value,
+    };
+
+    this.apiService.post('/game/getGames', params).subscribe(
+      (res: any) => {
+        this.isLoading = false;
+        const { code, data, total } = res;
+        if (code == 200) {
+          this.isLoading = false;
+          this.itemList = data;
+          this.itemList.forEach((item: any, index: number) => {
+            item.idx = index;
+          });
+          this.totalItems = total;
+        } else {
+          this.itemList = [];
+        }
+      },
+      () => {
+        this.isLoading = false;
+        // Error handling
+      }
+    );
+  }
+
+  // Handle page change in pagination
+  pageChange(val: number) {
+    this.currentPage = val;
+    this.getGameList();
+  }
+
+  // Handle page size change in pagination
+  pageSizeChange(val: number) {
+    this.pageSize = val;
+    this.getGameList();
+  }
+}

front/src/app/pages/layout/list/list.module.ts

@@ -0,0 +1,22 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RouterModule } from '@angular/router';
+import { SharedModule } from '../../../shared/shared.module';
+import { ListComponent } from './list.component';
+// import { FormatTimePipe } from '../../../pipe/formatTime.pipe';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    SharedModule,
+    RouterModule.forChild([
+      {
+        path: '',
+        component: ListComponent,
+      },
+    ]),
+  ],
+  declarations: [ListComponent],
+  exports: [ListComponent],
+})
+export class ListModule {}

front/src/app/pages/login/login.component.html

@@ -0,0 +1,120 @@
+<div class="login">
+  <div class="login">
+    <div
+      class="header"
+      style="
+        text-align: left;
+        padding-right: 40px;
+        color: rgba(255, 255, 255, 0.9);
+      "
+    >
+      The Game List App
+    </div>
+    <div class="login-container">
+      <div class="contenter">
+        <div class="login-title">{{ curStatus }}</div>
+        <form
+          *ngIf="curStatus == 'Login'"
+          nz-form
+          [formGroup]="validateForm"
+          class="login-form"
+          (ngSubmit)="submitForm('login')"
+        >
+          <nz-form-item>
+            <nz-form-control nzErrorTip="Please input your username!">
+              <nz-input-group nzPrefixIcon="user">
+                <input
+                  type="text"
+                  nz-input
+                  formControlName="username"
+                  placeholder="Username"
+                />
+              </nz-input-group>
+            </nz-form-control>
+          </nz-form-item>
+          <nz-form-item>
+            <nz-form-control nzErrorTip="Please input your Password!">
+              <nz-input-group nzPrefixIcon="lock">
+                <input
+                  type="password"
+                  nz-input
+                  formControlName="password"
+                  placeholder="Password"
+                />
+              </nz-input-group>
+            </nz-form-control>
+          </nz-form-item>
+          <button
+            nz-button
+            class="login-form-button login-form-margin"
+            [nzType]="'primary'"
+          >
+            Log in
+          </button>
+          Don't have an account?
+          <a (click)="changeLogin()" class="base-color">Quick regist!</a>
+        </form>
+        <form
+          *ngIf="curStatus == 'Register'"
+          nz-form
+          nzLayout="horizontal"
+          [formGroup]="validateForm"
+          class="login-form"
+          (ngSubmit)="submitForm('register')"
+        >
+          <nz-form-item>
+            <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="username" nzRequired>
+              <span>Username</span>
+            </nz-form-label>
+            <nz-form-control
+              [nzSm]="14"
+              [nzXs]="24"
+              nzErrorTip="Please input your username!"
+            >
+              <input
+                nz-input
+                id="username"
+                formControlName="username"
+                placeholder="Username"
+              />
+            </nz-form-control>
+          </nz-form-item>
+          <nz-form-item>
+            <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="password" nzRequired
+              >Password</nz-form-label
+            >
+            <nz-form-control
+              [nzSm]="14"
+              [nzXs]="24"
+              nzErrorTip="Please input your password!"
+            >
+              <input
+                nz-input
+                type="password"
+                id="password"
+                formControlName="password"
+                placeholder="Password"
+              />
+            </nz-form-control>
+          </nz-form-item>
+          <button
+            nz-button
+            class="login-form-button login-form-margin"
+            [nzType]="'primary'"
+          >
+            Register
+          </button>
+          <button
+            nz-button
+            [nzType]="'default'"
+            style="width: 100%"
+            class="base-color"
+            (click)="changeLogin()"
+          >
+            Back to Login
+          </button>
+        </form>
+      </div>
+    </div>
+  </div>
+</div>

front/src/app/pages/login/login.component.scss

@@ -0,0 +1,111 @@
+$baseColor: #d98410;
+:host ::ng-deep .login .login-form {
+  max-width: 100%;
+}
+.base-color {
+  color: $baseColor;
+}
+.login {
+  width: 100%;
+  height: 100%;
+  background: url("https://g8r2p8u00eb9tghqgkbq1lfbogl7f84o4k8ltm2h5q4jnv8i7aufukm3.saxyit.com:20992/steam/clusters/sale_autumn2019_assets/54b5034d397baccb93181cc6/home_header_bg_day_english.gif?BSLuBan=eyJob3N0IjoibWVkaWEuc3QuZGwuZWNjZG54LmNvbSIsImRuc19ob3N0IjoienRnZGwudi50cnBjZG4ubmV0IiwidHMiOjE3MDEwOTUzMTgsImJzcmVxaWQiOiIwZTQxODZiMjAyOTUyMmQ3MzdhYWRkZTdjZmQzNDhjYiIsImNhY2hlX2tleSI6Ilwvc3RlYW1cL2NsdXN0ZXJzXC9zYWxlX2F1dHVtbjIwMTlfYXNzZXRzXC81NGI1MDM0ZDM5N2JhY2NiOTMxODFjYzZcL2hvbWVfaGVhZGVyX2JnX2RheV9lbmdsaXNoLmdpZiIsImhvc3QzMDIiOiJmb2czMDItc3QuYnM1OGkuYmFpc2hhbmNkbnguY29tIiwia2V5IjoiNDE1MjY1YWVjMzY2ZGE2NjYzYmEyY2IyMTNjNDk1NGUiLCJmb2czMDIiOiJvbiJ9") no-repeat fixed center;
+  background-size: cover;
+  /* 可以设置不同的进入和离开动画 */
+  /* 设置持续时间和动画函数 */
+  .login-form,
+  .slide-fade-enter-active {
+    transition: all 0.3s ease;
+  }
+  .login-form,
+  .slide-fade-leave-active {
+    transition: all 0.5s cubic-bezier(1, 0.5, 0.8, 1);
+  }
+  .slide-fade-enter, .slide-fade-leave-to
+  /* .slide-fade-leave-active for below version 2.1.8 */ {
+    transform: translateX(10px);
+    opacity: 0;
+  }
+  .login-title {
+    margin: 10px 0 20px 0;
+    text-align: center;
+    font-weight: bold;
+    font-size: 30px;
+  }
+  .login-container {
+    padding-top: calc(50% - 200px);
+  }
+  .login-bottom {
+    height: 60px;
+    position: absolute;
+    left: 0;
+    bottom: 0;
+  }
+  .header {
+    width: 100%;
+    height: 80px;
+    position: absolute;
+    top: 37px;
+    text-align: left;
+    padding-left: 89px;
+    color: #fff;
+    font-size: 30px;
+    font-weight: 600;
+  }
+  .content {
+    width: 360px;
+    position: relative;
+    left: calc(50% - 180px);
+    z-index: 9;
+    background-color: rgba(251, 252, 241, 0.8);
+    /* opacity: 0.9; */
+    border-radius: 10px;
+    padding: 10px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  }
+  .contenter {
+    width: 400px;
+    height: 340px;
+    position: absolute;
+    top: calc(50% - 200px);
+    right: calc(50% - 200px);
+    z-index: 999;
+    background-color: rgba(255, 255, 255, 0.8);
+    border-radius: 10px;
+    padding: 20px 30px 20px;
+    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
+  }
+  .title {
+    font-size: 26px;
+    font-weight: 600;
+    margin-top: 10px;
+    margin-bottom: 40px;
+    text-align: center;
+    letter-spacing: 16px；;
+  }
+  .ruleForm {
+    position: absolute;
+    width: calc(100% - 60px);
+    /* padding-top: 20px; */
+  }
+  .con-title {
+    text-align: left;
+  }
+  .img-logo {
+    position: relative;
+    z-index: 9999;
+    /* top: 100px; */
+    left: calc(50% - 90px);
+  }
+
+  .login-form-margin {
+    margin-bottom: 16px;
+  }
+
+  .login-form-forgot {
+    float: right;
+  }
+
+  .login-form-button {
+    width: 100%;
+  }
+}

front/src/app/pages/login/login.component.ts

@@ -0,0 +1,76 @@
+import { Component, OnInit } from '@angular/core';
+import {
+  UntypedFormBuilder,
+  UntypedFormGroup,
+  Validators,
+} from '@angular/forms';
+import { NzMessageService } from 'ng-zorro-antd/message';
+import { NavigateService } from 'src/app/services/navigate.service';
+import { ApiService } from 'src/app/services/api.service';
+
+@Component({
+  selector: 'app-login',
+  templateUrl: './login.component.html',
+  styleUrls: ['./login.component.scss'],
+})
+export class LoginComponent implements OnInit {
+  curStatus: string = 'Login';
+  validateForm!: UntypedFormGroup;
+
+  changeLogin() {
+    if (this.curStatus == 'Login') this.curStatus = 'Register';
+    else this.curStatus = 'Login';
+    this.validateForm.reset();
+  }
+
+  submitForm(type: string): void {
+    if (this.validateForm.valid) {
+      console.log('submit', this.validateForm.value);
+      let loginModel = Object.assign(this.validateForm.value, {});
+      let url = type == 'login' ? '/games/login' : '/games/register';
+      console.log(url);
+      this.apiService.post(url, loginModel).subscribe((res: any) => {
+        const { code, msg, data } = res;
+        if (code === 200) {
+          if (type == 'login') {
+            this.$message.success('Login Success!');
+            localStorage.setItem('username', loginModel.username);
+            localStorage.setItem('token', data?.token);
+            localStorage.setItem('role', data?.role);
+            setTimeout(() => {
+              this.navigateService.navigate('layout');
+            }, 200);
+          } else {
+            this.$message.success('Regist success！');
+            setTimeout(() => {
+              this.curStatus = 'Login';
+            }, 200);
+          }
+        } else {
+          this.$message.error(msg);
+        }
+      });
+    } else {
+      Object.values(this.validateForm.controls).forEach((control: any) => {
+        if (control.invalid) {
+          control.markAsDirty();
+          control.updateValueAndValidity({ onlySelf: true });
+        }
+      });
+    }
+  }
+
+  constructor(
+    private fb: UntypedFormBuilder,
+    private apiService: ApiService,
+    private $message: NzMessageService,
+    private navigateService: NavigateService
+  ) {}
+
+  ngOnInit(): void {
+    this.validateForm = this.fb.group({
+      username: [null, [Validators.required]],
+      password: [null, [Validators.required]],
+    });
+  }
+}

front/src/app/pages/login/login.module.ts

@@ -0,0 +1,21 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RouterModule } from '@angular/router';
+import { SharedModule } from '../../shared/shared.module';
+import { LoginComponent } from './login.component';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    SharedModule,
+    RouterModule.forChild([
+      {
+        path: '',
+        component: LoginComponent,
+      },
+    ]),
+  ],
+  declarations: [LoginComponent],
+  exports: [LoginComponent],
+})
+export class LoginModule {}

front/src/app/pages/pageNotFound.component.ts

@@ -0,0 +1,10 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  template: `<h2>404 Page</h2>`,
+})
+export class PageNotFoundComponent implements OnInit {
+  constructor() {}
+
+  ngOnInit() {}
+}

front/src/app/pipe/formatTime.pipe.ts

@@ -0,0 +1,23 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({ name: 'formatTime' })
+export class FormatTimePipe implements PipeTransform {
+  //管道所要执行的事件  这个管道是身份证号的中间部分隐藏
+  //例如{{Name | 管道}} value指的是Name值
+  transform(value: number): any {
+    //idCard 将你value传过来的值进行正则修改 之后再返回idCard
+    var time;
+    var hours = parseInt(
+      (value % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60) + ''
+    );
+    var minutes = parseInt((value % (1000 * 60 * 60)) / (1000 * 60) + '');
+    var seconds = Math.ceil((value % (1000 * 60)) / 1000);
+    let hasHours = (hours < 10 ? '0' + hours : hours) + ':';
+    time =
+      (hours == 0 ? '' : hasHours) +
+      (minutes < 10 ? '0' + minutes : minutes) +
+      ':' +
+      (seconds < 10 ? '0' + seconds : seconds);
+    return time;
+  }
+}

front/src/app/services/api.service.ts

@@ -0,0 +1,32 @@
+import { Injectable } from '@angular/core';
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+
+import { NzMessageService } from 'ng-zorro-antd/message';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class ApiService {
+  _baseUrl = 'http://127.0.0.1:5000/api/v1';
+  constructor(
+    private httpClient: HttpClient,
+    private dialogService: NzMessageService
+  ) {}
+  get(url: string, params: any) {
+    return this.httpClient.get(this._baseUrl + url, params);
+  }
+  post(url: string, params: any) {
+    if (url.indexOf('login') !== -1 || url.indexOf('register') !== -1) {
+      return this.httpClient.post(this._baseUrl + url, params);
+    }
+    return this.httpClient.post(this._baseUrl + url, params, {
+      headers: new HttpHeaders().set(
+        'token',
+        localStorage.getItem('token') as any
+      ),
+    });
+  }
+}
+export function isNullOrUndefine(target: any): boolean {
+  return target === null || typeof target === 'undefined';
+}

front/src/app/services/navigate.service.ts

@@ -0,0 +1,33 @@
+import { Injectable } from '@angular/core';
+import { Router } from '@angular/router';
+import { Location } from '@angular/common';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class NavigateService {
+  constructor(private router: Router, private location: Location) {}
+
+  goToLogin() {
+    this.navigate('/login');
+  }
+
+  navigate(path: String, ext?: any) {
+    // 默认不记录历史
+    // let defaultExt = { skipLocationChange: true };
+    // ext = ext == null ? defaultExt : Object.assign(ext, defaultExt);
+    this.router.navigate([path], ext);
+  }
+
+  back() {
+    //history.back();
+    this.location.back();
+  }
+
+  // backTo(url) {
+  //   if (url === '/tabs/business') {
+  //     this.eventService.event.emit('load-business');
+  //   }
+  //   this.router.navigateByUrl(url);
+  // }
+}

front/src/app/shared/shared.module.ts

@@ -0,0 +1,50 @@
+import { NgModule } from '@angular/core';
+import { ReactiveFormsModule, FormsModule } from '@angular/forms';
+
+import { NzFormModule } from 'ng-zorro-antd/form';
+import { NzButtonModule } from 'ng-zorro-antd/button';
+import { NzInputModule } from 'ng-zorro-antd/input';
+import { NzIconModule } from 'ng-zorro-antd/icon';
+import { NzTableModule } from 'ng-zorro-antd/table';
+import { NzDividerModule } from 'ng-zorro-antd/divider';
+import { NzPopconfirmModule } from 'ng-zorro-antd/popconfirm';
+import { NzMessageService } from 'ng-zorro-antd/message';
+import { NzModalModule } from 'ng-zorro-antd/modal';
+import { NzCommentModule } from 'ng-zorro-antd/comment';
+import { NzListModule } from 'ng-zorro-antd/list';
+import { NzAvatarModule } from 'ng-zorro-antd/avatar';
+import { NzCardModule } from 'ng-zorro-antd/card';
+import { NzPaginationModule } from 'ng-zorro-antd/pagination';
+import { NzSpinModule } from 'ng-zorro-antd/spin';
+import { NzDropDownModule } from 'ng-zorro-antd/dropdown';
+import { NzSelectModule } from 'ng-zorro-antd/select';
+
+import { FormatTimePipe } from '../pipe/formatTime.pipe';
+
+@NgModule({
+  imports: [],
+  declarations: [FormatTimePipe],
+  exports: [
+    ReactiveFormsModule,
+    FormsModule,
+    NzFormModule,
+    NzInputModule,
+    NzButtonModule,
+    NzIconModule,
+    NzTableModule,
+    NzDividerModule,
+    NzPopconfirmModule,
+    NzModalModule,
+    NzCommentModule,
+    NzListModule,
+    NzAvatarModule,
+    NzCardModule,
+    NzPaginationModule,
+    NzSpinModule,
+    NzDropDownModule,
+    NzSelectModule,
+    FormatTimePipe,
+  ],
+  providers: [{ provide: NzMessageService }],
+})
+export class SharedModule {}

front/src/environments/environment.prod.ts

@@ -0,0 +1,3 @@
+export const environment = {
+  production: true
+};

front/src/environments/environment.ts

@@ -0,0 +1,16 @@
+// This file can be replaced during build by using the `fileReplacements` array.
+// `ng build` replaces `environment.ts` with `environment.prod.ts`.
+// The list of file replacements can be found in `angular.json`.
+
+export const environment = {
+  production: false
+};
+
+/*
+ * For easier debugging in development mode, you can import the following file
+ * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
+ *
+ * This import should be commented out in production mode because it will have a negative impact
+ * on performance if an error is thrown.
+ */
+// import 'zone.js/plugins/zone-error';  // Included with Angular CLI.

front/src/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>Game app</title>
+    <base href="/" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="icon" type="image/x-icon" href="music_favicon.ico" />
+  </head>
+  <body>
+    <app-root></app-root>
+  </body>
+</html>

front/src/main.ts

@@ -0,0 +1,12 @@
+import { enableProdMode } from '@angular/core';
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { AppModule } from './app/app.module';
+import { environment } from './environments/environment';
+
+if (environment.production) {
+  enableProdMode();
+}
+
+platformBrowserDynamic().bootstrapModule(AppModule)
+  .catch(err => console.error(err));

front/src/polyfills.ts

@@ -0,0 +1,53 @@
+/**
+ * This file includes polyfills needed by Angular and is loaded before the app.
+ * You can add your own extra polyfills to this file.
+ *
+ * This file is divided into 2 sections:
+ *   1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
+ *   2. Application imports. Files imported after ZoneJS that should be loaded before your main
+ *      file.
+ *
+ * The current setup is for so-called "evergreen" browsers; the last versions of browsers that
+ * automatically update themselves. This includes recent versions of Safari, Chrome (including
+ * Opera), Edge on the desktop, and iOS and Chrome on mobile.
+ *
+ * Learn more in https://angular.io/guide/browser-support
+ */
+
+/***************************************************************************************************
+ * BROWSER POLYFILLS
+ */
+
+/**
+ * By default, zone.js will patch all possible macroTask and DomEvents
+ * user can disable parts of macroTask/DomEvents patch by setting following flags
+ * because those flags need to be set before `zone.js` being loaded, and webpack
+ * will put import in the top of bundle, so user need to create a separate file
+ * in this directory (for example: zone-flags.ts), and put the following flags
+ * into that file, and then add the following code before importing zone.js.
+ * import './zone-flags';
+ *
+ * The flags allowed in zone-flags.ts are listed here.
+ *
+ * The following flags will work for all browsers.
+ *
+ * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
+ * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
+ * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
+ *
+ *  in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
+ *  with the following flag, it will bypass `zone.js` patch for IE/Edge
+ *
+ *  (window as any).__Zone_enable_cross_context_check = true;
+ *
+ */
+
+/***************************************************************************************************
+ * Zone JS is required by default for Angular itself.
+ */
+import 'zone.js';  // Included with Angular CLI.
+
+
+/***************************************************************************************************
+ * APPLICATION IMPORTS
+ */

front/src/styles.scss

@@ -0,0 +1,2 @@
+/* You can add global styles to this file, and also import other style files */
+@import "../node_modules/ng-zorro-antd/ng-zorro-antd.min.css";

front/src/test.ts

@@ -0,0 +1,26 @@
+// This file is required by karma.conf.js and loads recursively all the .spec and framework files
+
+import 'zone.js/testing';
+import { getTestBed } from '@angular/core/testing';
+import {
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting
+} from '@angular/platform-browser-dynamic/testing';
+
+declare const require: {
+  context(path: string, deep?: boolean, filter?: RegExp): {
+    <T>(id: string): T;
+    keys(): string[];
+  };
+};
+
+// First, initialize the Angular testing environment.
+getTestBed().initTestEnvironment(
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting(),
+);
+
+// Then we find all the tests.
+const context = require.context('./', true, /\.spec\.ts$/);
+// And load the modules.
+context.keys().forEach(context);

front/src/theme.less

@@ -0,0 +1,9 @@
+// Custom Theming for NG-ZORRO
+// For more information: https://ng.ant.design/docs/customize-theme/en
+@import "../node_modules/ng-zorro-antd/ng-zorro-antd.less";
+// @import "~ng-zorro-antd/ng-zorro-antd.less";
+
+// Override less variables to here
+// View all variables: https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/components/style/themes/default.less
+
+// @primary-color: #1890ff;

front/tsconfig.app.json

@@ -0,0 +1,15 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/app",
+    "types": []
+  },
+  "files": [
+    "src/main.ts",
+    "src/polyfills.ts"
+  ],
+  "include": [
+    "src/**/*.d.ts"
+  ]
+}

front/tsconfig.json

@@ -0,0 +1,32 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "compileOnSave": false,
+  "compilerOptions": {
+    "baseUrl": "./",
+    "outDir": "./dist/out-tsc",
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "noImplicitOverride": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true,
+    "sourceMap": true,
+    "declaration": false,
+    "downlevelIteration": true,
+    "experimentalDecorators": true,
+    "moduleResolution": "node",
+    "importHelpers": true,
+    "target": "es2020",
+    "module": "es2020",
+    "lib": [
+      "es2020",
+      "dom"
+    ]
+  },
+  "angularCompilerOptions": {
+    "enableI18nLegacyMessageIdFormat": false,
+    "strictInjectionParameters": true,
+    "strictInputAccessModifiers": true,
+    "strictTemplates": true
+  }
+}

front/tsconfig.spec.json

@@ -0,0 +1,18 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/spec",
+    "types": [
+      "jasmine"
+    ]
+  },
+  "files": [
+    "src/test.ts",
+    "src/polyfills.ts"
+  ],
+  "include": [
+    "src/**/*.spec.ts",
+    "src/**/*.d.ts"
+  ]
+}

front/zREADME.md

@@ -0,0 +1,27 @@
+# NgFront
+
+This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 14.2.9.
+
+## Development server
+
+Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files.
+
+## Code scaffolding
+
+Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
+
+## Build
+
+Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+## Running unit tests
+
+Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Running end-to-end tests
+
+Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.

output/dbCollection/games.metadata.json

@@ -0,0 +1 @@
+{"indexes":[{"v":{"$numberInt":"2"},"key":{"_id":{"$numberInt":"1"}},"name":"_id_"}],"uuid":"9898c9d125684739b5d1539e64c0fc1c","collectionName":"games","type":"collection"}

output/dbCollection/user.metadata.json

@@ -0,0 +1 @@
+{"indexes":[{"v":{"$numberInt":"2"},"key":{"_id":{"$numberInt":"1"}},"name":"_id_"}],"uuid":"c2c53b70bc4046cd89e87809b57a9efd","collectionName":"user","type":"collection"}

output/postman_collection.json

@@ -0,0 +1,736 @@
+{
+	"info": {
+		"_postman_id": "f3fde014-995b-46da-939a-4fcf92085cf1",
+		"name": "FlaskAngularMongoDB_game_202312",
+		"schema": "https://schema.getpostman.com/json/collection/v2.1.0/collection.json",
+		"_exporter_id": "15234337",
+		"_collection_link": "https://gold-spaceship-203375.postman.co/workspace/Team-Workspace~e1e4e7e7-fbf3-4eed-8155-25c636d86894/collection/13268592-f3fde014-995b-46da-939a-4fcf92085cf1?action=share&source=collection_link&creator=15234337"
+	},
+	"item": [
+		{
+			"name": "game_202312",
+			"item": [
+				{
+					"name": "login",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Status code is 200\", function () {\r",
+									"    pm.response.to.have.status(200);\r",
+									"});\r",
+									"pm.test(\"Body has msg\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData).to.have.property('msg');\r",
+									"});\r",
+									"pm.test('Response must be valid and have a body', function () {\r",
+									"    pm.response.to.be.ok;\r",
+									"    pm.response.to.be.withBody;\r",
+									"    pm.response.to.be.json;\r",
+									"});\r",
+									"pm.test('Body has token', function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData.data).to.have.property('token');\r",
+									"});"
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n\"username\":\"lzh\",\r\n\"password\":\"123456\"\r\n}",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/games/login",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"games",
+								"login"
+							]
+						}
+					},
+					"response": []
+				},
+				{
+					"name": "register",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Check status code and message\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData.code).to.be.oneOf([200, 500]);\r",
+									"    pm.expect(jsonData).to.have.property('msg');\r",
+									"});"
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n\"username\":\"lzh\",\r\n\"password\":\"123456\"\r\n}",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/games/register",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"games",
+								"register"
+							]
+						}
+					},
+					"response": []
+				},
+				{
+					"name": "addGame",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Response Content-Type is json\", function () {\r",
+									"    pm.response.to.have.header(\"Content-Type\", \"application/json\");\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response body has code and msg\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData).to.have.property(\"code\");\r",
+									"    pm.expect(jsonData).to.have.property(\"msg\");\r",
+									"});\r",
+									""
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n    \"Title\": \"MY TEST GAME 2\",\r\n    \"Original Price\": \"$29.99\",\r\n    \"Discounted Price\": \"$29.99\",\r\n    \"Release Date\": \"3 Aug, 2023\",\r\n    \"Link\": \"https://store.steampowered.com/app/1086940/Baldurs_Gate_3/\",\r\n    \"Game Description\": \"Baldur’s Gate 3 is a story-rich, party-based RPG set in the universe of Dungeons & Dragons, where your choices shape a tale of fellowship and betrayal, survival and sacrifice, and the lure of absolute power.\",\r\n    \"Recent Reviews Summary\": \"Overwhelmingly Positive\",\r\n    \"All Reviews Summary\": \"Very Positive\",\r\n    \"Recent Reviews Number\": \"- 96% of the 128,900 user reviews in the last 30 days are positive.\",\r\n    \"All Reviews Number\": \"- 94% of the 188,617 user reviews for this game are positive.\",\r\n    \"Developer\": \"Larian Studios\",\r\n    \"Publisher\": \"Larian Studios\",\r\n    \"Supported Languages\": [\"English\", \"French\", \"German\", \"Spanish - Spain\", \"Polish\", \"Russian\", \"Simplified Chinese\", \"Turkish\", \"Portuguese - Brazil\", \"Italian\", \"Spanish - Latin America\", \"Traditional Chinese\", \"Ukrainian\"],\r\n    \"Popular Tags\": [\"RPG\", \"Choices Matter\", \"Character Customization\", \"Story Rich\", \"Adventure\", \"Online Co-Op\", \"CRPG\", \"Multiplayer\", \"Fantasy\", \"Turn-Based Combat\", \"Dungeons & Dragons\", \"Co-op Campaign\", \"Strategy\", \"Singleplayer\", \"Romance\", \"Class-Based\", \"Dark Fantasy\", \"Combat\", \"Controller\", \"Stealth\"],\r\n    \"Game Features\": [\"Single-player\", \"Online Co-op\", \"LAN Co-op\", \"Steam Achievements\", \"Full controller support\", \"Steam Cloud\"],\r\n    \"Minimum Requirements\": \"Requires a 64-bit processor and operating system. OS: Windows 10 64-bit. Processor: Intel I5 4690 / AMD FX 8350. Memory: 8 GB RAM. Graphics: Nvidia GTX 970 / RX 480 (4GB+ of VRAM). DirectX: Version 11. Storage: 150 GB available space.\"\r\n}\r\n",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/game/addGame",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"game",
+								"addGame"
+							]
+						},
+						"description": "添加游戏选项，根据Titele进行添加重复校验。当前示例的所有字段的key都必须传，用户没有输入时需要给默认空值"
+					},
+					"response": []
+				},
+				{
+					"name": "getGames",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Status code is 200\", function () {\r",
+									"    pm.response.to.have.status(200);\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response Content-Type is json\", function () {\r",
+									"    pm.response.to.have.header(\"Content-Type\", \"application/json\");\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response code should be 200\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData.code).to.eql(200);\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response should have a total field\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData).to.have.property('total');\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Data should be an array\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData.data).to.be.an('array');\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Each item in data should have necessary properties\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    jsonData.data.forEach(function (item) {\r",
+									"        pm.expect(item).to.have.property('_id');\r",
+									"        pm.expect(item).to.have.property('Title');\r",
+									"        pm.expect(item).to.have.property('Original Price');\r",
+									"        pm.expect(item).to.have.property('Discounted Price');\r",
+									"        pm.expect(item).to.have.property('Release Date');\r",
+									"    });\r",
+									"});\r",
+									""
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n    \"page\": 1,\r\n    \"size\": 10,\r\n    \"Title\": \"Rust\",  // 可选，根据需要更改\r\n    \"Original Price\": \"\",  // 可选，根据需要更改\r\n    \"Developer\": \"\",  // 可选，根据需要更改\r\n    \"Game Features\": []  // 可选，根据需要更改\r\n}\r\n",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/game/getGames",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"game",
+								"getGames"
+							]
+						},
+						"description": "查询支持根据Original Price, Title, Developer, Game Features这几个字段查询 。Game Features传的是js数组，其余均是字符串"
+					},
+					"response": []
+				},
+				{
+					"name": "deleteGame",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Response body has code and msg\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData).to.have.property(\"code\");\r",
+									"    pm.expect(jsonData).to.have.property(\"msg\");\r",
+									"});\r",
+									"pm.test(\"Status code is 200\", function () {\r",
+									"    pm.response.to.have.status(200);\r",
+									"});"
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n    \"_id\":\"6391c1f4a83713458b00c349\"\r\n}",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/game/deleteGame",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"game",
+								"deleteGame"
+							]
+						}
+					},
+					"response": []
+				},
+				{
+					"name": "updateGame",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Response body has code and msg\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData).to.have.property(\"code\");\r",
+									"    pm.expect(jsonData).to.have.property(\"msg\");\r",
+									"});\r",
+									"pm.test(\"Status code is 200\", function () {\r",
+									"    pm.response.to.have.status(200);\r",
+									"});"
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n    \"_id\":\"\",\r\n    \"Title\": \"(Modified) MY TEST GAME\",\r\n    \"Original Price\": \"$29.99\",\r\n    \"Discounted Price\": \"$29.98\",\r\n    \"Release Date\": \"3 Aug, 2023\",\r\n    \"Link\": \"https://store.steampowered.com/app/1086940/Baldurs_Gate_3/\",\r\n    \"Game Description\": \"Baldur’s Gate 3 is a story-rich, party-based RPG set in the universe of Dungeons & Dragons, where your choices shape a tale of fellowship and betrayal, survival and sacrifice, and the lure of absolute power.\",\r\n    \"Recent Reviews Summary\": \"Overwhelmingly Positive\",\r\n    \"All Reviews Summary\": \"Very Positive\",\r\n    \"Recent Reviews Number\": \"- 96% of the 128,900 user reviews in the last 30 days are positive.\",\r\n    \"All Reviews Number\": \"- 94% of the 188,617 user reviews for this game are positive.\",\r\n    \"Developer\": \"Larian Studios\",\r\n    \"Publisher\": \"Larian Studios\",\r\n    \"Supported Languages\": [\"English\", \"French\", \"German\", \"Spanish - Spain\", \"Polish\", \"Russian\", \"Simplified Chinese\", \"Turkish\", \"Portuguese - Brazil\", \"Italian\", \"Spanish - Latin America\", \"Traditional Chinese\", \"Ukrainian\"],\r\n    \"Popular Tags\": [\"RPG\", \"Choices Matter\", \"Character Customization\", \"Story Rich\", \"Adventure\", \"Online Co-Op\", \"CRPG\", \"Multiplayer\", \"Fantasy\", \"Turn-Based Combat\", \"Dungeons & Dragons\", \"Co-op Campaign\", \"Strategy\", \"Singleplayer\", \"Romance\", \"Class-Based\", \"Dark Fantasy\", \"Combat\", \"Controller\", \"Stealth\"],\r\n    \"Game Features\": [\"Single-player\", \"Online Co-op\", \"LAN Co-op\", \"Steam Achievements\", \"Full controller support\", \"Steam Cloud\"],\r\n    \"Minimum Requirements\": \"Requires a 64-bit processor and operating system. OS: Windows 10 64-bit. Processor: Intel I5 4690 / AMD FX 8350. Memory: 8 GB RAM. Graphics: Nvidia GTX 970 / RX 480 (4GB+ of VRAM). DirectX: Version 11. Storage: 150 GB available space.\"\r\n}",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/game/updateGame",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"game",
+								"updateGame"
+							]
+						}
+					},
+					"response": []
+				},
+				{
+					"name": "addReview",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Response Content-Type is json\", function () {\r",
+									"    pm.response.to.have.header(\"Content-Type\", \"application/json\");\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response body has code and msg\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData).to.have.property(\"code\");\r",
+									"    pm.expect(jsonData).to.have.property(\"msg\");\r",
+									"});\r",
+									"pm.test(\"check update_time\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData.data).to.have.property('update_time');\r",
+									"});"
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n    \"username\":\"lzh\",\r\n    \"_id\":\"655acf60a83dcb3825d85c30\",//从Games列表获取的\r\n    \"review\":\"Balalalalalalfewfe\"\r\n}",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/addReview",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"addReview"
+							]
+						}
+					},
+					"response": []
+				},
+				{
+					"name": "deleteReview",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Response Content-Type is json\", function () {\r",
+									"    pm.response.to.have.header(\"Content-Type\", \"application/json\");\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response body has code and msg\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData).to.have.property(\"code\");\r",
+									"    pm.expect(jsonData).to.have.property(\"msg\");\r",
+									"});"
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"protocolProfileBehavior": {
+						"disabledSystemHeaders": {
+							"host": true
+						}
+					},
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n    \"gameId\":\"655acf60a83dcb3825d85c30\",\r\n    \"review_id\":\"28902846-8756-11ee-9bfd-802bf9d9f3ea\"\r\n}",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/deleteReview",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"deleteReview"
+							]
+						}
+					},
+					"response": []
+				},
+				{
+					"name": "getReviews",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Status code is 200\", function () {\r",
+									"    pm.response.to.have.status(200);\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response Content-Type is json\", function () {\r",
+									"    pm.response.to.have.header(\"Content-Type\", \"application/json\");\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response code should be 200\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData.code).to.eql(200);\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response should have a msg field\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData).to.have.property('msg');\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Data should be an array\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData.data).to.be.an('array');\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Each item in data should have necessary properties\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    jsonData.data.forEach(function (item) {\r",
+									"        pm.expect(item).to.have.property('review');\r",
+									"        pm.expect(item).to.have.property('timestamp');\r",
+									"        pm.expect(item).to.have.property('update_time');\r",
+									"        pm.expect(item).to.have.property('username');\r",
+									"    });\r",
+									"});\r",
+									""
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n    \"gameId\":\"655acf60a83dcb3825d85c30\"\r\n}",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/getReviews",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"getReviews"
+							]
+						}
+					},
+					"response": []
+				},
+				{
+					"name": "collectGame",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Response Content-Type is json\", function () {\r",
+									"    pm.response.to.have.header(\"Content-Type\", \"application/json\");\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response body has code and msg\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData).to.have.property(\"code\");\r",
+									"    pm.expect(jsonData).to.have.property(\"msg\");\r",
+									"});"
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n    \"gameId\":\"655acf60a83dcb3825d85c30\",\r\n    \"username\":\"lzh\"\r\n}",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/games/collectGame",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"games",
+								"collectGame"
+							]
+						}
+					},
+					"response": []
+				},
+				{
+					"name": "getCollectList",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Status code is 200\", function () {\r",
+									"    pm.response.to.have.status(200);\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response Content-Type is json\", function () {\r",
+									"    pm.response.to.have.header(\"Content-Type\", \"application/json\");\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response code should be 200\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData.code).to.eql(200);\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response should have a msg field\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData).to.have.property('msg');\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Data should be an array\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData.data).to.be.an('array');\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Each item in data should have necessary properties\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    jsonData.data.forEach(function (item) {\r",
+									"        pm.expect(item).to.have.property('_id');\r",
+									"        pm.expect(item).to.have.property('Title');\r",
+									"        pm.expect(item).to.have.property('Original Price');\r",
+									"        pm.expect(item).to.have.property('Discounted Price');\r",
+									"        pm.expect(item).to.have.property('Release Date');\r",
+									"    });\r",
+									"});\r",
+									""
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n    \"username\":\"lzh\"\r\n}",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/game/getCollectList",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"game",
+								"getCollectList"
+							]
+						}
+					},
+					"response": []
+				},
+				{
+					"name": "cacelCollectGame",
+					"event": [
+						{
+							"listen": "test",
+							"script": {
+								"exec": [
+									"pm.test(\"Response Content-Type is json\", function () {\r",
+									"    pm.response.to.have.header(\"Content-Type\", \"application/json\");\r",
+									"});\r",
+									"\r",
+									"pm.test(\"Response body has code and msg\", function () {\r",
+									"    var jsonData = pm.response.json();\r",
+									"    pm.expect(jsonData).to.have.property(\"code\");\r",
+									"    pm.expect(jsonData).to.have.property(\"msg\");\r",
+									"});"
+								],
+								"type": "text/javascript"
+							}
+						}
+					],
+					"request": {
+						"method": "POST",
+						"header": [],
+						"body": {
+							"mode": "raw",
+							"raw": "{\r\n    \"gameId\":\"655acf60a83dcb3825d85c30\",\r\n    \"username\":\"lzh\"\r\n}",
+							"options": {
+								"raw": {
+									"language": "json"
+								}
+							}
+						},
+						"url": {
+							"raw": "http://127.0.0.1:5000/api/v1/games/cancelCollectGame",
+							"protocol": "http",
+							"host": [
+								"127",
+								"0",
+								"0",
+								"1"
+							],
+							"port": "5000",
+							"path": [
+								"api",
+								"v1",
+								"games",
+								"cancelCollectGame"
+							]
+						}
+					},
+					"response": []
+				}
+			]
+		}
+	]
+}

output/postman_test_run.json

@@ -0,0 +1,550 @@
+{
+	"id": "faf549a5-54fc-4a26-bd4d-42d9b369dabb",
+	"name": "FlaskAngularMongoDB_game_202312",
+	"timestamp": "2023-11-28T08:25:44.675Z",
+	"collection_id": "13268592-f3fde014-995b-46da-939a-4fcf92085cf1",
+	"folder_id": 0,
+	"environment_id": "0",
+	"totalPass": 38,
+	"delay": 0,
+	"persist": true,
+	"status": "finished",
+	"startedAt": "2023-11-28T08:25:43.620Z",
+	"totalFail": 0,
+	"results": [
+		{
+			"id": "b834a654-11d2-4dd9-9269-9aee12027a9b",
+			"name": "login",
+			"url": "http://127.0.0.1:5000/api/v1/games/login",
+			"time": 40,
+			"responseCode": {
+				"code": 200,
+				"name": "OK"
+			},
+			"tests": {
+				"Status code is 200": true,
+				"Body has msg": true,
+				"Response must be valid and have a body": true,
+				"Body has token": true
+			},
+			"testPassFailCounts": {
+				"Status code is 200": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Body has msg": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response must be valid and have a body": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Body has token": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				40
+			],
+			"allTests": [
+				{
+					"Status code is 200": true,
+					"Body has msg": true,
+					"Response must be valid and have a body": true,
+					"Body has token": true
+				}
+			]
+		},
+		{
+			"id": "40ff8bb0-5f22-4ad0-9dee-9063e54d94df",
+			"name": "register",
+			"url": "http://127.0.0.1:5000/api/v1/games/register",
+			"time": 41,
+			"responseCode": {
+				"code": 200,
+				"name": "OK"
+			},
+			"tests": {
+				"Check status code and message": true
+			},
+			"testPassFailCounts": {
+				"Check status code and message": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				41
+			],
+			"allTests": [
+				{
+					"Check status code and message": true
+				}
+			]
+		},
+		{
+			"id": "bde3eb7a-f40f-4b19-b05c-fbfe064bd8d6",
+			"name": "addGame",
+			"url": "http://127.0.0.1:5000/api/v1/game/addGame",
+			"time": 42,
+			"responseCode": {
+				"code": 400,
+				"name": "BAD REQUEST"
+			},
+			"tests": {
+				"Response Content-Type is json": true,
+				"Response body has code and msg": true
+			},
+			"testPassFailCounts": {
+				"Response Content-Type is json": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response body has code and msg": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				42
+			],
+			"allTests": [
+				{
+					"Response Content-Type is json": true,
+					"Response body has code and msg": true
+				}
+			]
+		},
+		{
+			"id": "5383c444-8086-4845-b0a7-f2611bc50fd3",
+			"name": "getGames",
+			"url": "http://127.0.0.1:5000/api/v1/game/getGames",
+			"time": 78,
+			"responseCode": {
+				"code": 200,
+				"name": "OK"
+			},
+			"tests": {
+				"Status code is 200": true,
+				"Response Content-Type is json": true,
+				"Response code should be 200": true,
+				"Response should have a total field": true,
+				"Data should be an array": true,
+				"Each item in data should have necessary properties": true
+			},
+			"testPassFailCounts": {
+				"Status code is 200": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response Content-Type is json": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response code should be 200": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response should have a total field": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Data should be an array": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Each item in data should have necessary properties": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				78
+			],
+			"allTests": [
+				{
+					"Status code is 200": true,
+					"Response Content-Type is json": true,
+					"Response code should be 200": true,
+					"Response should have a total field": true,
+					"Data should be an array": true,
+					"Each item in data should have necessary properties": true
+				}
+			]
+		},
+		{
+			"id": "e62f8a70-686a-441d-bc4a-cf44aabd4059",
+			"name": "deleteGame",
+			"url": "http://127.0.0.1:5000/api/v1/game/deleteGame",
+			"time": 40,
+			"responseCode": {
+				"code": 200,
+				"name": "OK"
+			},
+			"tests": {
+				"Response body has code and msg": true,
+				"Status code is 200": true
+			},
+			"testPassFailCounts": {
+				"Response body has code and msg": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Status code is 200": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				40
+			],
+			"allTests": [
+				{
+					"Response body has code and msg": true,
+					"Status code is 200": true
+				}
+			]
+		},
+		{
+			"id": "bda9421e-1a1a-40c6-b142-7ca2f043dd19",
+			"name": "updateGame",
+			"url": "http://127.0.0.1:5000/api/v1/game/updateGame",
+			"time": 3,
+			"responseCode": {
+				"code": 200,
+				"name": "OK"
+			},
+			"tests": {
+				"Response body has code and msg": true,
+				"Status code is 200": true
+			},
+			"testPassFailCounts": {
+				"Response body has code and msg": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Status code is 200": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				3
+			],
+			"allTests": [
+				{
+					"Response body has code and msg": true,
+					"Status code is 200": true
+				}
+			]
+		},
+		{
+			"id": "57f9a610-1c1c-4e59-8437-94d31b379fb2",
+			"name": "addReview",
+			"url": "http://127.0.0.1:5000/api/v1/addReview",
+			"time": 40,
+			"responseCode": {
+				"code": 200,
+				"name": "OK"
+			},
+			"tests": {
+				"Response Content-Type is json": true,
+				"Response body has code and msg": true,
+				"check update_time": true
+			},
+			"testPassFailCounts": {
+				"Response Content-Type is json": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response body has code and msg": {
+					"pass": 1,
+					"fail": 0
+				},
+				"check update_time": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				40
+			],
+			"allTests": [
+				{
+					"Response Content-Type is json": true,
+					"Response body has code and msg": true,
+					"check update_time": true
+				}
+			]
+		},
+		{
+			"id": "02c38124-112c-4010-bc77-b7f2397047a3",
+			"name": "deleteReview",
+			"url": "http://127.0.0.1:5000/api/v1/deleteReview",
+			"time": 39,
+			"responseCode": {
+				"code": 200,
+				"name": "OK"
+			},
+			"tests": {
+				"Response Content-Type is json": true,
+				"Response body has code and msg": true
+			},
+			"testPassFailCounts": {
+				"Response Content-Type is json": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response body has code and msg": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				39
+			],
+			"allTests": [
+				{
+					"Response Content-Type is json": true,
+					"Response body has code and msg": true
+				}
+			]
+		},
+		{
+			"id": "7da82563-50ff-42fc-94d2-920b78b1ce45",
+			"name": "getReviews",
+			"url": "http://127.0.0.1:5000/api/v1/getReviews",
+			"time": 44,
+			"responseCode": {
+				"code": 200,
+				"name": "OK"
+			},
+			"tests": {
+				"Status code is 200": true,
+				"Response Content-Type is json": true,
+				"Response code should be 200": true,
+				"Response should have a msg field": true,
+				"Data should be an array": true,
+				"Each item in data should have necessary properties": true
+			},
+			"testPassFailCounts": {
+				"Status code is 200": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response Content-Type is json": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response code should be 200": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response should have a msg field": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Data should be an array": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Each item in data should have necessary properties": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				44
+			],
+			"allTests": [
+				{
+					"Status code is 200": true,
+					"Response Content-Type is json": true,
+					"Response code should be 200": true,
+					"Response should have a msg field": true,
+					"Data should be an array": true,
+					"Each item in data should have necessary properties": true
+				}
+			]
+		},
+		{
+			"id": "8bf38b01-f809-4945-845f-b0af97ad9db8",
+			"name": "collectGame",
+			"url": "http://127.0.0.1:5000/api/v1/games/collectGame",
+			"time": 43,
+			"responseCode": {
+				"code": 200,
+				"name": "OK"
+			},
+			"tests": {
+				"Response Content-Type is json": true,
+				"Response body has code and msg": true
+			},
+			"testPassFailCounts": {
+				"Response Content-Type is json": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response body has code and msg": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				43
+			],
+			"allTests": [
+				{
+					"Response Content-Type is json": true,
+					"Response body has code and msg": true
+				}
+			]
+		},
+		{
+			"id": "82d334e1-6533-4d27-ac5c-4a6c2e7fd951",
+			"name": "getCollectList",
+			"url": "http://127.0.0.1:5000/api/v1/game/getCollectList",
+			"time": 77,
+			"responseCode": {
+				"code": 200,
+				"name": "OK"
+			},
+			"tests": {
+				"Status code is 200": true,
+				"Response Content-Type is json": true,
+				"Response code should be 200": true,
+				"Response should have a msg field": true,
+				"Data should be an array": true,
+				"Each item in data should have necessary properties": true
+			},
+			"testPassFailCounts": {
+				"Status code is 200": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response Content-Type is json": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response code should be 200": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response should have a msg field": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Data should be an array": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Each item in data should have necessary properties": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				77
+			],
+			"allTests": [
+				{
+					"Status code is 200": true,
+					"Response Content-Type is json": true,
+					"Response code should be 200": true,
+					"Response should have a msg field": true,
+					"Data should be an array": true,
+					"Each item in data should have necessary properties": true
+				}
+			]
+		},
+		{
+			"id": "5a284321-6d44-4e1e-a917-57d49cc204e2",
+			"name": "cacelCollectGame",
+			"url": "http://127.0.0.1:5000/api/v1/games/cancelCollectGame",
+			"time": 40,
+			"responseCode": {
+				"code": 200,
+				"name": "OK"
+			},
+			"tests": {
+				"Response Content-Type is json": true,
+				"Response body has code and msg": true
+			},
+			"testPassFailCounts": {
+				"Response Content-Type is json": {
+					"pass": 1,
+					"fail": 0
+				},
+				"Response body has code and msg": {
+					"pass": 1,
+					"fail": 0
+				}
+			},
+			"times": [
+				40
+			],
+			"allTests": [
+				{
+					"Response Content-Type is json": true,
+					"Response body has code and msg": true
+				}
+			]
+		}
+	],
+	"count": 1,
+	"totalTime": 527,
+	"collection": {
+		"requests": [
+			{
+				"id": "b834a654-11d2-4dd9-9269-9aee12027a9b",
+				"method": "POST"
+			},
+			{
+				"id": "40ff8bb0-5f22-4ad0-9dee-9063e54d94df",
+				"method": "POST"
+			},
+			{
+				"id": "bde3eb7a-f40f-4b19-b05c-fbfe064bd8d6",
+				"method": "POST"
+			},
+			{
+				"id": "5383c444-8086-4845-b0a7-f2611bc50fd3",
+				"method": "POST"
+			},
+			{
+				"id": "e62f8a70-686a-441d-bc4a-cf44aabd4059",
+				"method": "POST"
+			},
+			{
+				"id": "bda9421e-1a1a-40c6-b142-7ca2f043dd19",
+				"method": "POST"
+			},
+			{
+				"id": "57f9a610-1c1c-4e59-8437-94d31b379fb2",
+				"method": "POST"
+			},
+			{
+				"id": "02c38124-112c-4010-bc77-b7f2397047a3",
+				"method": "POST"
+			},
+			{
+				"id": "7da82563-50ff-42fc-94d2-920b78b1ce45",
+				"method": "POST"
+			},
+			{
+				"id": "8bf38b01-f809-4945-845f-b0af97ad9db8",
+				"method": "POST"
+			},
+			{
+				"id": "82d334e1-6533-4d27-ac5c-4a6c2e7fd951",
+				"method": "POST"
+			},
+			{
+				"id": "5a284321-6d44-4e1e-a917-57d49cc204e2",
+				"method": "POST"
+			}
+		]
+	}
+}

readme.md

@@ -0,0 +1,51 @@
+# Netflix电影/电视剧数据web展示
+数据来源见项目地址:backend/dataset/netflix_titles.csv     
+数据已经爬取到本地，可以直接使用     
+数据库连接用内网穿透的，在db.py中修改连接地址
+# 一、项目启动
+### 1.1、前端启动
+见front文件夹下的readme.md
+### 1.2、后端启动
+`python backend/app.py`
+
+
+# 二、通用接口（登录/注册）
+## 1 登录、注册
+### 1.1 登录
+post /login
+#### 参数
+| 参数名       | 类型 | 说明 |
+|:----------| :--- | :--- |
+|  username | string | 用户名|
+|  password | string | 密码|
+
+#### 返回值
+| 参数名       | 类型 | 说明          |
+|:----------| :--- |:------------|
+|  code | int | 状态码,0成功1失败. |
+|  msg | string | 提示信息        |
+|  data | object | 返回数据        |
+
+### 1.2 注册
+post /register
+#### 参数
+| 参数名       | 类型 | 说明 |
+|:----------| :--- | :--- |
+|  username | string | 用户名|
+|  password | string | 密码|
+
+#### 返回值
+| 参数名       | 类型 | 说明          |
+|:----------| :--- |:------------|
+|  code | int | 状态码,0成功1失败. |
+|  msg | string | 提示信息        |
+|  data | object | 返回数据        |
+
+## 3、其他接口文档
+### (当前仅实现login/register/getMovies三个接口)
+- 全部功能包括   
+1、登陆/注册   
+2、首页展示游戏信息,需分页(可以参考数据来源地址的页面)，首页搜索功能（一个搜索框即可）   
+3、首页列表项的增删改查   
+4、详情信息中评论添加/删除   
+- 完整接口文档见postman导出文件`./backend/netflixApi.json`   

运行说明.txt

@@ -0,0 +1,4 @@
+运行说明
+打开项目，命令行cd front进入到前端文件目录,第一次运行时需要执行npm install
+执行完成后再执行npm start启动前端项目
+启动后端直接运行backend下的app.py即可，确保本地mongodb已启动