WeChat アプレットの開発方法 | WeChat アプレットをベースにした診療予約システムの設計と実装

著者ホームページ:プログラミングコンパス

著者について: Java 分野の高品質クリエイター、CSDN ブログエキスパート、CSDN コンテンツパートナー、Nuggets の招待著者、Alibaba Cloud ブログエキスパート、51CTO 招待著者、長年のアーキテクト設計経験、Tencent 教室の常駐講師

主な内容：Javaプロジェクト、Pythonプロジェクト、フロントエンドプロジェクト、人工知能とビッグデータ、履歴書テンプレート、教材、面接質問バンク、技術相互支援

お気に入り、いいね、迷わず作者フォローすると良いです

記事の最後にあるソースコードを入手してください

商品番号：BS-XCX-013

1. 環境紹介

ロケール: Java: jdk1.8

データベース: MySQL: mysql5.7

アプリケーションサーバー: Tomcat: tomcat8.5.31

開発ツール: IDEA または eclipse

フロントエンド開発技術: WeChat アプレット + Vue + ElementUI

背景開発技術: springboot+mybatis-plus

2. プロジェクト紹介

2.1 基本的な概要

現在、中国では情報技術が広く普及しており、国民生活、教育における情報活用、医療における情報改革、交通における情報普及など、さまざまな側面や角度に関わり、中国は次の方向に向かって進んでいます。科学技術は前進します。

中国の経済水準の向上により、中国人の生活もより豊かになり、豊かな生活の始まりにより、人々は自分の健康にますます注意を払うようになり、より便利になりました。モバイルインターネット技術をベースにした最新の技術的手段をどのように利用して、一般の人がオンライン診療の予約をより簡単かつ迅速に行えるようにするか、これがこのシステムが解決することに焦点を当てている問題です。

調査と訪問の後、このオンライン診療予約管理システムは WeChat アプレットを使用して開発および実装されました。データストレージは MySQL データベースに基づいており、フロントエンドは WeChat アプレットを使用して開発され、バックエンドは Springboot フレームワークに基づいており、Nodejs の開発と実装が行われています。、フロントページ表示は Vue+ElementUI で実装されています。システムのフロントエンドユーザーは、主に情報の閲覧、登録ホールでのオンライン登録、自分の予約の表示、個人情報の変更などを行いますが、医師ユーザーは、予約患者の表示、診断情報の入力、予約情報の管理などを、 WeChat アプレット。バックグラウンドでは主に、ユーザー管理、コンテンツ管理、イベントと予約の管理、予約ユーザー数のカウントなどの機能を実装します。このシステムの開始により、国民は大変利便性が高まり、受診にかかる時間が大幅に短縮されます。

2.2 需要分析

WeChat アプレットに基づくこの診療予約管理システムの開発と実装に基づいて、調査と分析を行った結果、2 種類のユーザーの役割が必要であると結論付けられました。1 つはシステムのフロントエンドユーザーで、もう 1 つはシステムのフロントエンドユーザーです。バックエンド管理者ユーザー。フロントエンドユーザーはさらに患者ユーザーと医師ユーザーに分けられ、患者はWeChatミニプログラムを通じてログインした後、主なニーズはこのプラットフォームを通じて最新情報のプッシュとオンライン予約登録の取得、予約情報の作成と記入です。治療説明書を作成し、予約時間情報も同時に公開します。バックグラウンド管理者ユーザーは主に関連データの管理機能を実装します。1 つはニュースダイナミクスの管理操作を実現すること、2 つ目は予約情報の管理を実現すること、3 つ目は登録ユーザーの情報管理機能を実現することです。 4 つ目は、オンライン情報の閲覧や統計などの機能を実行することです。

2.3 機能設計

調査と訪問後の需要分析により、下図に示すように、WeChat アプレットに基づくオンライン診療予約管理システムの各ユーザー役割の主な機能モジュール図が得られます。

バックグラウンド管理者がバックグラウンド管理システムにログインすることで実現できる主な機能モジュールは、ユーザー管理、アナウンス管理、カルーセルマップ管理、情報分類管理、情報情報管理、登録情報管理、情報統計レポートなどの機能です。

図2-1 バックグラウンド機能の構造図

フロントエンドの患者ユーザーは、登録後に WeChat アプレットにログインできます。主に、システムのお知らせの表示、関連情報の表示、登録会場での医師情報の表示とオンライン登録、ニュース記事の「いいね！」の収集、医師へのコメント、個人情報の表示が可能です。パーソナルセンターで情報を収集し、個人情報を管理し、あなた自身の予約登録情報を管理します。

図 2-2 ミニプログラムにおける患者ユーザーの機能構成図

フロントエンド医師のユーザーは、主にシステムのお知らせの表示、関連情報の表示、登録ホールでの医師情報の表示、ニュース記事の「いいね！」と保存、自分の時間帯の予約情報の表示と管理を行うために、WeChat アプレットにログインします。パーソナルセンターでは、個人コレクション内の情報を表示し、個人情報を管理し、予約登録情報を公開することができます。

図2-3 ミニプログラムにおける医師ユーザーの機能構成図

2.4 データベース設計

データベーステーブルの詳細設計は主にエンティティモデルの分析に基づいており、主要なビジネスフィールドに基づいて主キー情報を比較するためにデータストレージに必要なフィールドをいくつか追加します。診療予約システムに関わるデータベースの物理テーブル構造を以下に示します。

Article_type : 記事分類情報テーブル。主にニュース記事の分類情報が格納されます。

表3-1 情報分類情報テーブル(article_type)

名前	タイプ	ヌル	デフォルト	他の	述べる
タイプID	smallint(5) 符号なし	いいえ	<自動インクリメント>		カテゴリID : [0,10000]
画面	smallint(4) 符号なし	いいえ	100		表示順序: [0,1000] で分類表示の順序が決まります
名前	varchar(16)	いいえ			カテゴリ名: [2,16]
父親ID	smallint(5) 符号なし	いいえ	0		親カテゴリID : [0,32767]
説明	varchar(255)	はい	<空> _ _		説明: [0,255] は分類の役割を説明します。
アイコン	文章	はい			カテゴリアイコン:
URL	varchar(255)	はい	<空> _ _		外部リンクアドレス：[0,255]カテゴリから他のサイトに飛ぶ場合はこのURLに設定してください
作成時間	タイムスタンプ	いいえ	<INSERT-タイムスタンプ>		作成時間:
更新時間	タイムスタンプ	いいえ	<INSERT-タイムスタンプ>		更新時間:

記事: ニュース記事情報テーブル。主に一部のニュース情報を保存および公開し、フロントエンドで分類して表示できます。

表 3-2 情報テーブル（記事）

名前	タイプ	ヌル	デフォルト	他の	述べる
記事ID	mediaint(8) 署名なし	いいえ	<自動インクリメント>		記事ID : [0,8388607]
タイトル	varchar(125)	いいえ			タイトル: [0,125] は記事やHTMLのタイトルタグで使用されます
タイプ	varchar(64)	いいえ	0		記事分類: [0,1000]指定された種類の記事の検索に使用されます
ヒット	int(10) 符号なし	いいえ	0		ヒット数: [0,1000000000]この記事を訪れた人の数
賞賛レン	int(11)	いいえ	0		いいね！
作成時間	タイムスタンプ	いいえ	<INSERT-タイムスタンプ>		作成時間:
更新時間	タイムスタンプ	いいえ	<INSERT-タイムスタンプ>		更新時間:
ソース	varchar(255)	はい	<空> _ _		出典: [0,255]記事の出典
URL	varchar(255)	はい	<空> _ _		ソースアドレス：[0,255]は記事を掲載したWebサイトへジャンプします。
鬼ごっこ	varchar(255)	はい	<空> _ _		タグ: [0,255] は記事の関連コンテンツをマークするために使用され、複数のタグはスペースで区切られます。
コンテンツ	長文	はい			本文：記事の主な内容
画像	varchar(255)	はい	<空> _ _		表紙絵
説明	文章	はい			記事の説明

register_hall: 登録ホール情報テーブル。主に公開された医師登録情報が格納されます。

表 3-3 登録会場情報テーブル(registration_hall)

名前	タイプ	ヌル	デフォルト	他の	述べる
登録ホールID	int(11)	いいえ	<自動インクリメント>		登録ホールID
部門番号	varchar(64)	いいえ			部門番号
部署名	varchar(64)	はい	<空> _ _		部署名
訪問医師	int(11)	はい	0		訪問医
訪問時間	varchar(64)	はい	<空> _ _		拝観時間
ソースの数	int(11)	はい	0		ソースの数
名簿ステータス	varchar(64)	はい	<空> _ _		スケジュール状況
医師の写真	varchar(255)	はい	<空> _ _		医師の写真
医師のプロフィール	長文	はい			医師プロフィール
ヒット	int(11)	いいえ	0		ヒット
賞賛レン	int(11)	いいえ	0		いいね！
お勧め	int(11)	いいえ	0		インテリジェントな推奨事項
作成時間	日付時刻	いいえ	<INSERT-タイムスタンプ>		作成時間
更新時間	タイムスタンプ	いいえ	<INSERT-タイムスタンプ>		更新時間

登録情報: フロントエンドユーザー予約情報テーブル。主にフロントエンドユーザーの予約情報が格納されます。

表 3-4 予約情報フォーム (registration_information)

名前	タイプ	ヌル	デフォルト	他の	述べる
登録情報id	int(11)	いいえ	<自動インクリメント>		登録情報ID
予約ユーザー	int(11)	はい	0		購読者
予約時間	varchar(64)	はい	<空> _ _		予定
連絡先番号	varchar(64)	はい	<空> _ _		連絡先番号
部門番号	varchar(64)	はい	<空> _ _		部門番号
部署名	varchar(64)	はい	<空> _ _		部署名
訪問医師	int(11)	はい	0		訪問医
訪問時間	varchar(64)	はい	<空> _ _		拝観時間
予定数	varchar(64)	はい	<空> _ _		予約数
訪問状況	varchar(64)	はい	<空> _ _		健康状態
ユーザーコメント	文章	はい			ユーザーのコメント
doctor_advice	text	是			医生建议
recommend	int(11)	否	0		智能推荐
create_time	datetime	否	<INSERT-TimeStamp>		创建时间
update_time	timestamp	否	<INSERT-TimeStamp>		更新时间

ordinary_users：前端注册用户信息表，主要存储前端注册的用户信息。

表3-5 前端注册用户信息表（ordinary_users）

名称	类型	空	默认值	其他	备注
ordinary_users_id	int(11)	否	<auto_increment>		普通用户ID
user_name	varchar(64)	否			用户姓名
user_gender	varchar(64)	是	<空>		用户性别
user_age	varchar(64)	是	<空>		用户年龄
id	varchar(255)	是	<空>		身份证
date_of_birth	varchar(64)	是	<空>		出生年月
examine_state	varchar(16)	否	已通过		审核状态
recommend	int(11)	否	0		智能推荐
user_id	int(11)	否	0		用户ID
create_time	datetime	否	<INSERT-TimeStamp>		创建时间
update_time	timestamp	否	<INSERT-TimeStamp>		更新时间

notice：系统公告信息表，主要存储系统发布的公告信息。

表3-6 系统公告信息表（notice）

名称	类型	空	默认值	其他	备注
notice_id	mediumint(8) unsigned	否	<auto_increment>		公告id：
title	varchar(125)	否			标题：
content	longtext	是			正文：
create_time	timestamp	否	<INSERT-TimeStamp>		创建时间：
update_time	timestamp	否	<INSERT-TimeStamp>		更新时间：

doctor_user：医生信息表，主要存储系统中涉及到的医生信息。

表3-7 医生信息表（doctor_user）

名称	类型	空	默认值	其他	备注
doctor_user_id	int(11)	否	<auto_increment>		医生用户ID
doctor_job_number	varchar(64)	否			医生工号
name_of_doctor	varchar(64)	是	<空>		医生姓名
doctor_gender	varchar(64)	是	<空>		医生性别
doctor_age	varchar(64)	是	<空>		医生年龄
id	varchar(64)	是	<空>		身份证
date_of_birth	varchar(64)	是	<空>		出生年月
doctor_certificate	varchar(255)	是	<空>		医生证件
examine_state	varchar(16)	否	已通过		审核状态
recommend	int(11)	否	0		智能推荐
user_id	int(11)	否	0		用户ID
create_time	datetime	否	<INSERT-TimeStamp>		创建时间
update_time	timestamp	否	<INSERT-TimeStamp>		更新时间

comment：评论信息表，主要存储用户对医生的评论信息。

表3-8 评论信息表（comment）

名称	类型	空	默认值	其他	备注
comment_id	int(11) unsigned	否	<auto_increment>		评论ID：
user_id	int(11) unsigned	否	0		评论人ID：
reply_to_id	int(11) unsigned	否	0		回复评论ID：空为0
content	longtext	是			内容：
nickname	varchar(255)	是	<空>		昵称：
avatar	varchar(255)	是	<空>		头像地址：[0,255]
create_time	timestamp	否	<INSERT-TimeStamp>		创建时间：
update_time	timestamp	否	<INSERT-TimeStamp>		更新时间：
source_table	varchar(255)	是	<空>		来源表：
source_field	varchar(255)	是	<空>		来源字段：
source_id	int(10) unsigned	否	0		来源ID：

User：后台管理用户信息表，主要存储后台登陆用户信息。

表3-9 后台用户信息表（user）

名称	类型	空	默认值	其他	备注
user_id	mediumint(8) unsigned	否	<auto_increment>		用户ID：[0,8388607]用户获取其他与用户相关的数据
state	smallint(1) unsigned	否	1		账户状态：[0,10](1可用\|2异常\|3已冻结\|4已注销)
user_group	varchar(32)	是	<空>		所在用户组：[0,32767]决定用户身份和权限
login_time	timestamp	否	<INSERT-TimeStamp>		上次登录时间：
phone	varchar(11)	是	<空>		手机号码：[0,11]用户的手机号码，用于找回密码时或登录时
phone_state	smallint(1) unsigned	否	0		手机认证：[0,1](0未认证\|1审核中\|2已认证)
username	varchar(16)	否			用户名：[0,16]用户登录时所用的账户名称
nickname	varchar(16)	是			昵称：[0,16]
password	varchar(64)	否			密码：[0,32]用户登录所需的密码，由6-16位数字或英文组成
email	varchar(64)	是			邮箱：[0,64]用户的邮箱，用于找回密码时或登录时
email_state	smallint(1) unsigned	否	0		邮箱认证：[0,1](0未认证\|1审核中\|2已认证)
avatar	varchar(255)	是	<空>		头像地址：[0,255]
create_time	timestamp	否	<INSERT-TimeStamp>		创建时间：

三，系统展示

ユーザーログイン

システムホーム

オンライン予約

バックグラウンドログイン

ユーザー管理

カルーセル管理

登録情報管理

登録統計

コンテンツ管理

4番目、コアコード表示

package com.project.demo.controller.base;

import com.alibaba.fastjson.JSONArray;
import com.alibaba.fastjson.JSONObject;
import com.project.demo.service.base.BaseService;
import lombok.Setter;
import lombok.extern.slf4j.Slf4j;
import org.apache.poi.hssf.usermodel.HSSFWorkbook;
import org.springframework.transaction.annotation.Transactional;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.multipart.MultipartFile;
import javax.persistence.Query;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.File;
import java.io.IOException;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

/**
 */
@Slf4j
public class BaseController<E, S extends BaseService<E>> {

    @Setter
    protected S service;


    @PostMapping("/add")
    @Transactional
    public Map<String, Object> add(HttpServletRequest request) throws IOException {
        service.insert(service.readBody(request.getReader()));
        return success(1);
    }

    @Transactional
    public Map<String, Object> addMap(Map<String,Object> map){
        service.insert(map);
        return success(1);
    }

    @PostMapping("/set")
	@Transactional
    public Map<String, Object> set(HttpServletRequest request) throws IOException {
        service.update(service.readQuery(request), service.readConfig(request), service.readBody(request.getReader()));
        return success(1);
    }


    @RequestMapping(value = "/del")
    @Transactional
    public Map<String, Object> del(HttpServletRequest request) {
        service.delete(service.readQuery(request), service.readConfig(request));
        return success(1);
    }

    @RequestMapping("/get_obj")
    public Map<String, Object> obj(HttpServletRequest request) {
        Query select = service.select(service.readQuery(request), service.readConfig(request));
        List resultList = select.getResultList();
        if (resultList.size() > 0) {
            JSONObject jsonObject = new JSONObject();
            jsonObject.put("obj",resultList.get(0));
            return success(jsonObject);
        } else {
            return success(null);
        }
    }


    @RequestMapping("/get_list")
    public Map<String, Object> getList(HttpServletRequest request) {
        Map<String, Object> map = service.selectToPage(service.readQuery(request), service.readConfig(request));
        return success(map);
    }

    @RequestMapping("/list_group")
    public Map<String, Object> listGroup(HttpServletRequest request) {
        Map<String, Object> map = service.selectToList(service.readQuery(request), service.readConfig(request));
        return success(map);
    }

    @RequestMapping("/bar_group")
    public Map<String, Object> barGroup(HttpServletRequest request) {
        Map<String, Object> map = service.selectBarGroup(service.readQuery(request), service.readConfig(request));
        return success(map);
    }

    @RequestMapping(value = {"/count_group", "/count"})
    public Map<String, Object> count(HttpServletRequest request) {
        Query count = service.count(service.readQuery(request), service.readConfig(request));
        return success(count.getResultList());
    }

    @RequestMapping(value = {"/sum_group", "/sum"})
    public Map<String, Object> sum(HttpServletRequest request) {
        Query count = service.sum(service.readQuery(request), service.readConfig(request));
        return success(count.getResultList());
    }

    @RequestMapping(value = {"/avg_group", "/avg"})
	public Map<String, Object> avg(HttpServletRequest request) {
        Query count = service.avg(service.readQuery(request), service.readConfig(request));
        return success(count.getResultList());
    }


    @PostMapping("/upload")
    public Map<String, Object> upload(@RequestParam("file") MultipartFile file) {
        log.info("进入方法");
        if (file.isEmpty()) {
            return error(30000, "没有选择文件");
        }
        try {
            //判断有没路径，没有则创建
            String filePath = System.getProperty("user.dir") + "\\target\\classes\\static\\upload\\";
            File targetDir = new File(filePath);
            if (!targetDir.exists() && !targetDir.isDirectory()) {
                if (targetDir.mkdirs()) {
                    log.info("创建目录成功");
                } else {
                    log.error("创建目录失败");
                }
            }
//            String path = ResourceUtils.getURL("classpath:").getPath() + "static/upload/";
//            String filePath = path.replace('/', '\\').substring(1, path.length());
            String fileName = file.getOriginalFilename();
            File dest = new File(filePath + fileName);
            log.info("文件路径:{}", dest.getPath());
            log.info("文件名:{}", dest.getName());
            file.transferTo(dest);
            JSONObject jsonObject = new JSONObject();
            jsonObject.put("url", "/api/upload/" + fileName);
            return success(jsonObject);
        } catch (IOException e) {
            log.info("上传失败：{}", e.getMessage());
        }
        return error(30000, "上传失败");
    }

    @PostMapping("/import_db")
    public Map<String, Object> importDb(@RequestParam("file") MultipartFile file) throws IOException {
        service.importDb(file);
        return success(1);
    }

    @RequestMapping("/export_db")
    public void exportDb(HttpServletRequest request, HttpServletResponse response) throws IOException {
        HSSFWorkbook sheets = service.exportDb(service.readQuery(request), service.readConfig(request));
        response.setContentType("application/octet-stream");
        response.setHeader("Content-disposition", "attachment;filename=employee.xls");
        response.flushBuffer();
        sheets.write(response.getOutputStream());
        sheets.close();
    }

    public Map<String, Object> success(Object o) {
        Map<String, Object> map = new HashMap<>();
        if (o == null) {
            map.put("result", null);
            return map;
        }
        if (o instanceof List) {
            if (((List) o).size() == 1) {
               o =  ((List) o).get(0);
                map.put("result", o);
            }else {
                String jsonString = JSONObject.toJSONString(o);
                JSONArray objects = service.covertArray(JSONObject.parseArray(jsonString));
                map.put("result", objects);
            }
        } else if (o instanceof Integer || o instanceof String) {
            map.put("result", o);
        } else {
            String jsonString = JSONObject.toJSONString(o);
            JSONObject jsonObject = JSONObject.parseObject(jsonString);
            JSONObject j = service.covertObject(jsonObject);
            map.put("result", j);
        }
        return map;
    }

    public Map<String, Object> error(Integer code, String message) {
        Map<String, Object> map = new HashMap<>();
        map.put("error", new HashMap<String, Object>(4) {
   
   {
            put("code", code);
            put("message", message);
        }});
        return map;
    }
}