WeChatアプレット注文システムの開発と実装

プログラミング 2022-05-29 14:13:38 訪問数: null

著者のホームページ：Qianzhiheのプログラミング

著者について：Java、フロントエンド、Pythone開発、長年にわたり、昇格、プロジェクトマネージャー、アーキテクトとして働いていました

主な内容：Javaプロジェクト開発、卒業デザイン開発、面接技術分類、最新技術共有

1.プロジェクトの紹介

       インターネット技術が徐々に生活に浸透するにつれ、人々の生活や消費の習慣は大きく変化しました。レストランでの食事に関しては、インターネット技術やモバイルインターネット技術の応用も普及しており、たとえば、数年前に登場したレストラン注文システムは、紙のメニューから情報技術を介した従来の注文方法に取って代わりました。この方法により、顧客の注文や電話が容易になり、第2に、販売者が個々の注文を一元管理できるため、注文のエラー率が低下し、ユーザーエクスペリエンスが向上するため、広く使用でき、人気があります。

       モバイルインターネットの出現により、スマートフォンのエンパワーメントがさらに拡大しました。TencentWeChatはWeChatミニプログラムをタイムリーに開始し、スマートフォンユーザーがWeChatを通じて対応する情報管理と参加を行えるようにしました。ビジネスフォーマットはモバイルに直接組み込まれています。従来のPCインターネットからのインターネット。この軽量APPアプリケーションは、ユーザーにとって非常に便利であり、WeChatを介してマーチャントに多くのトラフィックをもたらします。

     WeChatミニプログラムの機能の開始により、全国で2億人を超えるWeChatユーザーが大幅に促進され、このエコシステム上に大企業帝国が構築され、ミニプログラムによって開発されたアプリケーションはさまざまな業界に急速に浸透しました。また、外食産業における情報技術の応用にも体系的な変化がありました。たとえば、ユーザーの自己注文機能は、ユーザーを大幅に容易にし、注文の距離制限を減らすWeChatアプレットを介して実現されます。ユーザーは次のことができます。レストランで携帯電話の電源を入れます。WeChatアプレットを使用して、レストランに行く途中や自宅で食事を注文することもできます。これにより、時間とスペースの制限がなくなり、柔軟性と利便性が向上します。調査とフィールド分析を経て、WeChatアプレットの調査に基づいて、このWeChatアプレット注文システムは、外食産業の情報構築に貢献するために開発されました。

上記のWeChatアプレット注文システムの機能要件の分析に従って、WeChatアプレット注文システムの機能構造図を下の図1-1に示すように設計します。

 

図1-1システム機能の構造図

     フロントエンドユーザーは、WeChatアカウントバインディングを使用してアプレットにログインします。現在、テストアカウントにはこの権限がないため、開発者としてのみテストできます。フロントエンドユーザーは、携帯電話アプレットでシステムによってリリースされた食事を閲覧して、完全な注文プロセスを実現できます。対応する食事をショッピングカートに追加し、購入を注文し、関連する注文情報を表示できます。

    バックグラウンドユーザーは、主に対応するビジネスデータ管理のために、対応する操作を実行するためにログインする必要があります。

    ユーザー管理：フロントエンドとバックエンドでユーザー情報を管理し、対応するデータの追加、削除、変更、およびクエリ操作を実行できます。

    食事管理：注文システムによってリリースされた食事情報を管理し、対応するデータの追加、削除、変更、およびクエリ操作を実行できます。

    注文管理：フロントエンドユーザーの注文情報に対して対応する管理操作を実行します。

    分類管理：主にフロントエンドの注文表示に表示される食事の分類管理を実現します。

    システム管理：主にシステムの関連する基本情報の管理操作を実現できます。

2.環境紹介

バックエンド開発：

ロケール：Java：jdk1.8

データベース：Mysql：mysql5.7

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

開発ツール：IDEAまたはEclipse

フロントエンド開発：

開発ツール：WeChat開発者ツール

開発技術：WeChatアプレット

全体がフロントエンドとバックエンドの別々の開発を採用し、フロントエンドとバックエンドは別々にテストされます

3、システムディスプレイ

3.1 WeChatMiniProgram汎用モジュールの表示

3.1.1フロントページの表示

   WeChatアプレット注文のフロントエンドは、主に、予約注文、メニューブラウジング、電話注文、およびカスタマーサービスのモジュールを含む注文操作を実現することです。具体的な操作インターフェースを下図4-1に示します。

図3-1フロントページのホームページインターフェイス

 

3.1.2フロントエンドメニューブラウジングモジュール

以下の図3-2に示すように、ユーザーはWeChat注文システムに入り、参照メニューに入り、レストランからリリースされた食品情報を表示します。

図3-2メニューブラウジングインターフェイス

3.1.3フロントエンドユーザーのショッピングカートモジュール

    WeChatアプレット注文フロントエンドユーザーがシステムにログインした後、予約注文モジュールに入り、ショッピングカートに食事を追加できます。ユーザーログインは、ユーザーのWeChatアカウントを直接バインドしてログインします。これは非常に便利です。ショッピングカートの追加インターフェイスを下の図3-3に示します。

図3-3フロントエンドユーザーによるショッピングカートの追加操作インターフェイス

3.1.4フロントエンドユーザー注文支払いモジュール

    注文システムにログインした後、フロントエンドユーザーは予約注文モジュールに入り、お気に入りの食事をショッピングカートに追加し、注文を送信して、購入の支払いを行うことができます。食事の購入を完了し、注文操作全体を完了した後、食事にコメントすることができます。関連する管理インターフェイスを以下の図3-4に示します。

図3-4フロントエンドユーザーによる支払いインターフェースの注文

3.1.4フロントエンドユーザーの個人注文管理モジュール

    WeChatアプレット注文フロントエンドユーザーがシステムにログインした後、Myモジュールの個人注文管理モジュールで個人注文情報を管理できます。以下の図3-5に、フロントエンドユーザーの個人注文管理インターフェイスを示します。

図3-5フロントエンドユーザーの個人注文管理インターフェース

3.2背景機能モジュールの表示

3.2.1ユーザーログイン機能

    WeChatアプレット注文のバックグラウンドユーザーがレストランの関連情報を管理および操作する場合は、関連する操作を開始する前に、まずシステムにログインする必要があります。携帯電話番号とパスワードを入力した後のユーザーログインインターフェイスを図3-6に示します。

図3-6ユーザーログインインターフェイス

3.2.2ユーザー管理機能

    WeChatアップル注文システム管理者ユーザーがシステムにログインした後、ユーザー管理メニューに入り、対応する管理者ユーザー情報を管理できます。ユーザー管理インターフェイスを以下の図3-7および3-8に示します。

図3-7背景ユーザー管理機能のインターフェース図

図3-8バックグラウンドユーザーを追加するためのインターフェイス

3.2.3バックグラウンドの食事管理操作UI

    WeChatアプレット注文管理者ユーザーがシステムにログインした後、彼または彼女は食品管理メニューに入り、対応する食品情報を管理できます。主に食事の追加、変更、照会、削除などの操作が含まれます。食事を追加するときに、表示する食事の写真を指定できます。食事情報管理の操作インターフェースを下図3-9、3-10に示します。

図3-9バックグラウンドミール管理機能のUIインターフェース

図3-10バックグラウンドミールの新機能のUIインターフェイス

3.2.4バックグラウンド食品注文管理操作UI

    WeChatアプレット注文システム管理者ユーザーがシステムにログインした後、彼または彼女は食品注文管理メニューに入り、対応する食品注文情報を管理できます。主に食事の注文の問い合わせ、注文の詳細の表示などが含まれます。食事を追加するときに、食事の写真をアップロードして表示できます。注文情報管理インターフェースを以下の図3-11および3-12に示します。

図3-11バックグラウンド注文管理機能のUIインターフェース

図3-12バックグラウンドで注文の詳細を表示するためのUIインターフェイス

第四に、コアコードの表示

package com.imooc.controller;

import com.imooc.constant.CookieConstant;
import com.imooc.constant.RedisConstant;
import com.imooc.dataobject.SellerInfo;
import com.imooc.enums.ResultEnum;
import com.imooc.exception.SellException;
import com.imooc.form.SellerForm;
import com.imooc.repository.SellerInfoRepository;
import com.imooc.utils.CookieUtil;

import org.springframework.beans.BeanUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.GetMapping;
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.bind.annotation.RestController;
import org.springframework.web.servlet.ModelAndView;

import java.util.List;
import java.util.Map;
import java.util.UUID;

import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.validation.Valid;

import lombok.extern.slf4j.Slf4j;


@RestController
@RequestMapping("/admin")
@Slf4j
public class AdminUserController {

    @Autowired
    SellerInfoRepository repository;

    /**
     * 后台用户登陆操作
     * @param phone
     * @param password
     * @param response
     * @return
     */
    @GetMapping("/loginAdmin")
    public String loginAdmin(@RequestParam("phone") String phone,
                             @RequestParam("password") String password,
                             HttpServletResponse response) {
        SellerInfo sellerInfo = repository.findByPhone(phone);
        log.info("商家信息={}", sellerInfo);
        if (sellerInfo != null && sellerInfo.getPassword().equals(password)) {
            String token = UUID.randomUUID().toString();
            log.info("登录成功的token={}", token);
            Integer expire = RedisConstant.EXPIRE;
            //3. 设置token至cookie
            CookieUtil.set(response, CookieConstant.TOKEN, token, expire);
            return "登录成功";
        } else {
            throw new SellException(ResultEnum.LOGIN_FAIL);
        }
    }

    @GetMapping("/logout")
    public ModelAndView logout(HttpServletRequest request,
                               HttpServletResponse response,
                               Map<String, Object> map) {
        //1. 从cookie里查询
        Cookie cookie = CookieUtil.get(request, CookieConstant.TOKEN);
        if (cookie != null) {
            //2. 清除cookie
            CookieUtil.set(response, CookieConstant.TOKEN, null, 0);
        }
        map.put("msg", ResultEnum.LOGOUT_SUCCESS.getMessage());
        map.put("url", "/sell/seller/order/list");
        return new ModelAndView("common/success", map);
    }

    /*
     * 页面相关
     * */

    @GetMapping("/list")
    public ModelAndView list(Map<String, Object> map) {
        List<SellerInfo> categoryList = repository.findAll();
        map.put("categoryList", categoryList);
        return new ModelAndView("admin/list", map);
    }

    @GetMapping("/index")
    public ModelAndView index(@RequestParam(value = "sellerId", required = false) Integer sellerId,
                              Map<String, Object> map) {
        SellerInfo sellerInfo = repository.findBySellerId(sellerId);
        map.put("category", sellerInfo);

        return new ModelAndView("admin/index", map);
    }

    /**
     * 保存/更新
     */
    @PostMapping("/save")
    public ModelAndView save(@Valid SellerForm form,
                             BindingResult bindingResult,
                             Map<String, Object> map) {
        log.info("SellerForm={}", form);
        if (bindingResult.hasErrors()) {
            map.put("msg", bindingResult.getFieldError().getDefaultMessage());
            map.put("url", "/sell/admin/index");
            return new ModelAndView("common/error", map);
        }
        SellerInfo sellerInfo = new SellerInfo();
        try {
            if (form.getSellerId() != null) {
                sellerInfo = repository.findBySellerId(form.getSellerId());
            }
            BeanUtils.copyProperties(form, sellerInfo);
            repository.save(sellerInfo);
        } catch (SellException e) {
            map.put("msg", e.getMessage());
            map.put("url", "/sell/admin/index");
            return new ModelAndView("common/error", map);
        }

        map.put("url", "/sell/admin/list");
        return new ModelAndView("common/success", map);
    }
}

package com.imooc.controller;

import com.imooc.VO.ResultVO;
import com.imooc.converter.OrderForm2OrderDTOConverter;
import com.imooc.dto.OrderDTO;
import com.imooc.enums.ResultEnum;
import com.imooc.exception.SellException;
import com.imooc.form.OrderForm;
import com.imooc.service.BuyerService;
import com.imooc.service.OrderService;
import com.imooc.utils.ResultVOUtil;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.util.CollectionUtils;
import org.springframework.util.StringUtils;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.GetMapping;
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.bind.annotation.RestController;

import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.validation.Valid;

import lombok.extern.slf4j.Slf4j;

/**
 * Created by znz
 */
@RestController
@RequestMapping("/buyer/order")
@Slf4j
public class BuyerOrderController {

    @Autowired
    private OrderService orderService;

    @Autowired
    private BuyerService buyerService;

    //创建订单
    @PostMapping("/create")
    public ResultVO<Map<String, String>> create(@Valid OrderForm orderForm,
                                                BindingResult bindingResult) {
        if (bindingResult.hasErrors()) {
            log.error("【创建订单】参数不正确, orderForm={}", orderForm);
            throw new SellException(ResultEnum.PARAM_ERROR.getCode(),
                    bindingResult.getFieldError().getDefaultMessage());
        }

        OrderDTO orderDTO = OrderForm2OrderDTOConverter.convert(orderForm);
        if (CollectionUtils.isEmpty(orderDTO.getOrderDetailList())) {
            log.error("【创建订单】购物车不能为空");
            throw new SellException(ResultEnum.CART_EMPTY);
        }

        OrderDTO createResult = orderService.create(orderDTO);

        Map<String, String> map = new HashMap<>();
        map.put("orderId", createResult.getOrderId());

        return ResultVOUtil.success(map);
    }

    //订单列表
    @GetMapping("/listByStatus")
    public ResultVO<List<OrderDTO>> listByStatus(@RequestParam("openid") String openid,
                                                 @RequestParam(value = "orderStatus", defaultValue = "0") Integer orderStatus) {
        if (StringUtils.isEmpty(openid)) {
            log.error("【查询订单列表】openid为空");
            throw new SellException(ResultEnum.PARAM_ERROR);
        }

        List<OrderDTO> orderList = buyerService.findOrderList(openid, orderStatus);
        return ResultVOUtil.success(orderList);
    }


    //订单详情
    @GetMapping("/detail")
    public ResultVO<OrderDTO> detail(@RequestParam("openid") String openid,
                                     @RequestParam("orderId") String orderId) {
        OrderDTO orderDTO = buyerService.findOrderOne(openid, orderId);
        return ResultVOUtil.success(orderDTO);
    }

    //确认收货
    @PostMapping("/sure")
    public ResultVO sure(@RequestParam("openid") String openid,
                           @RequestParam("orderId") String orderId) {
        buyerService.cancelOrder(openid, orderId);
        return ResultVOUtil.success();
    }

    //取消订单
    @PostMapping("/cancel")
    public ResultVO cancel(@RequestParam("openid") String openid,
                           @RequestParam("orderId") String orderId) {
        buyerService.cancelOrder(openid, orderId);
        return ResultVOUtil.success();
    }
}


package com.imooc.controller;

import com.imooc.VO.ResultVO;
import com.imooc.dataobject.Comment;
import com.imooc.dataobject.OrderMaster;
import com.imooc.dto.OrderDTO;
import com.imooc.enums.OrderStatusEnum;
import com.imooc.enums.ResultEnum;
import com.imooc.exception.SellException;
import com.imooc.repository.CommentRepository;
import com.imooc.repository.OrderMasterRepository;
import com.imooc.service.OrderService;
import com.imooc.utils.ResultVOUtil;

import org.springframework.beans.BeanUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

import java.util.List;

/**
 * desc:评论相关
 */
@RestController
public class CommentController {

    @Autowired
    private CommentRepository repository;
    @Autowired
    private OrderService orderService;
    @Autowired
    private OrderMasterRepository masterRepository;

    //订单详情
    @PostMapping("/comment")
    public ResultVO<Comment> detail(@RequestParam("openid") String openid,
                                    @RequestParam("orderId") String orderId,
                                    @RequestParam("name") String name,
                                    @RequestParam("avatarUrl") String avatarUrl,
                                    @RequestParam("content") String content) {
        if (StringUtils.isEmpty(openid) || StringUtils.isEmpty(orderId)) {
            throw new SellException(ResultEnum.PARAM_ERROR);
        }
        //提交评论
        Comment comment = new Comment();
        comment.setName(name);
        comment.setAvatarUrl(avatarUrl);
        comment.setOpenid(openid);
        comment.setContent(content);
        Comment save = repository.save(comment);

        //修改订单状态
        OrderDTO orderDTO = orderService.findOne(orderId);
        orderDTO.setOrderStatus(OrderStatusEnum.COMMENT.getCode());
        OrderMaster orderMaster = new OrderMaster();
        BeanUtils.copyProperties(orderDTO, orderMaster);
        OrderMaster updateResult = masterRepository.save(orderMaster);
        return ResultVOUtil.success(save);
    }

    //所有评论
    @GetMapping("/commentList")
    public ResultVO<List<Comment>> commentList() {
        List<Comment> all = repository.findAll();
        return ResultVOUtil.success(all);
    }

    //单个用户的所有评论
    @GetMapping("/userCommentList")
    public ResultVO<List<Comment>> userCommentList(@RequestParam("openid") String openid) {
        List<Comment> all = repository.findAllByOpenid(openid);
        return ResultVOUtil.success(all);
    }
}

V.プロジェクトの概要

    WeChatアプレット注文システムのユーザーには、主に2つのユーザーロールが含まれます。1つは管理者ロールで、もう1つはフロントエンドユーザーロールです。これら2つのロールの具体的な機能は次のとおりです。

    管理者の役割：管理者は、WeChatアプレット注文システムのバックグラウンド管理にログインした後、対応する管理操作を実行できます。主に、ユーザー管理、食事管理、注文管理、分類管理、およびその他の操作が含まれます。

     フロントエンドユーザーの役割：WeChatミニプログラム注文システムにログインした後、フロントエンドユーザーは食事を閲覧したり、ショッピングカートに追加したり、オンラインで食事を注文したり、個人的な注文を管理したりできます。

     システム全体の機能は完全です。WeChatアプレット注文システムの要件の分析に従って、WeChatアプレット注文システムの概要設計が実行され、これに基づいて詳細設計が実行されます。プロジェクト全体の詳細設計が完了すると、プロジェクトのコーディングフェーズが開始されます。

おすすめ

転載: blog.csdn.net/BS009/article/details/124996625
おすすめ
LFOSSA Yuanlaisusu オープン コース | クラウド ネイティブの未来をマスターする: CNCF 認定資格と試験準備のヒントの包括的なガイド
ランキング
[ブリックジャワ]学ぶための5分、算術演算子
英国のエッセイを書くには、次の点に注意してください。
【質疑応答シリーズ】バックエンドから返されるjsonの出力をフォーマットし、コードを強調表示する方法
イベントが発生したYunqi 2019会議、？
非常に使いやすいAndroid 6.0の許可申請ツールを推奨
インターセプトし、使用にVueの-CLI3 axiosルート
CentOS Stream 9 でピーナッツ シェルをインストールして使用し、イントラネットに侵入して Web サイトを構築する方法
CreditEaseマイクロタスクスケジューリングサービスプラットフォームの構築の練習|シェアを記録
WrapPanelのWPFのレイアウト
keras 深層学習フレームワークは、畳み込みニューラル ネットワーク cnn を通じて手書き数字認識を実現します
アーカイブ
もっと
2024-04-26(22)
2024-04-25(31)
2024-04-24(30)
2024-04-23(31)
2024-04-22(5)
2024-04-21(0)
2024-04-20(6)
2024-04-19(5)
2024-04-18(0)
2024-04-17(31)

コードワールド

© 2018 codetd.com