基于鸿蒙的旅游APP 前端和后端课设毕设大作业实训指导项目

本文链接：https://blog.csdn.net/coder1998/article/details/146496294

鸿蒙旅游APP前后端项目

1 项目概述

旅游APP 前端可以用户进行注册，登录，首页列表，搜索景区，景区分类，景区详情，景区预定，知识问答，社区讨论，个人中心，个人订单，关于我们，隐私政策，退出登录

旅游APP后端包含管理员登录，系统管理用户维护，菜单维护，权限维护，景区管理，发布景区，修改景区，景区列表，删除景区，查询景区，订单管理，订单列表，订单查询退出登录

2 项目技术和开发工具

前端： ArkUI TypeScript 开发工具 deveco studio
后端: SpringBoot MyBatis 开发工具 idea
数据存储: mysql关系型数据库

3 数据库设计

t_order 订单表
t_pl 评论表
t_products 产品表
t_menu 菜单表
t_permission 权限表
t_role 角色表
t_role_permission 角色权限表
t_user 用户表
t_user_role 用户角色表

4 功能效果图

前端和后端图
在这里插入图片描述
核心代码实现：

景区维护:
在这里插入图片描述

景区新增(java代码)：

  //新增景区
    @PostMapping("/addProduct")
    @ResponseBody
    public int addProduct(Product product){
        productService.addProduct(product);
        Integer productId = Integer.parseInt(product.getId()+"");
        //添加成功返回景区id
        return productId;
    }

订单维护：
在这里插入图片描述
订单维护(java代码)：

@GetMapping("/listpage")
    @ResponseBody
    public PageList listpage(OrderQuery orderQuery){
        return  orderService.listpage(orderQuery);
    }

前端注册界面:
在这里插入图片描述

登陆表单设计

build() {
    Column(){
        Image($r('app.media.logo'))
          .width(100)
          .height(100)
          .margin({top:20})
      TextInput({
        placeholder:'请输入账号',text:this.username
      })
        .placeholderColor('#666')
        .height(40)
        .borderRadius(20)
        .backgroundColor('#fff')
        .margin({top:100})
        .onChange((value)=>{this.username=value})

        TextInput({
          placeholder:'请输入密码',text:this.password
        })
          .placeholderColor('#666')
          .height(40)
          .borderRadius(20)
          .backgroundColor('#fff')
          .margin({top:20})
          .type(InputType.Password)
          .onChange((value)=>{this.password=value})

       Row(){
          Checkbox()
            .width(10)
            .margin({top:7})
            .onChange((value: boolean) => {
                this.isChecked = value
            })
          Text() {
            Span('我已经阅读并同意')
            Span('《系统隐私政策》  ').fontColor('#3274f6')
            Span('《系统用户服务协议》').fontColor('#3274f6')
            Span('未注册的手机号码将自动注册未系统账号')
          }
           .fontSize(12)
           .fontColor('#666')
           .lineHeight(20)
       }.alignItems(VerticalAlign.Top)
        .margin({top:20})

       Button('登录')
         .width('100%')
         .backgroundColor('#bf2838')
         .margin({top:25})
         .onClick(()=>{
           this.clickLogin()
         })

       Row({space:115}){
          Text('新用户注册').fontSize(14).fontColor('#666')
            .onClick(()=>{
              router.replaceUrl({
                url:'pages/Reg'
              })
            })
          Text('忘记密码').fontSize(14).fontColor('#666')
       }
       .margin({top:15})
    }
    .padding(20)
    .width('100%')
    .height('100%')
    .backgroundImage($r('app.media.bg'))
    .backgroundImageSize(ImageSize.Cover)
  }
}

首页:

在这里插入图片描述
首页轮播:

Swiper() {
          Image($r('app.media.lb1'))
          Image($r('app.media.lb2'))
          Image($r('app.media.lb3'))
          Image($r('app.media.lb4'))
        }
        .width('100%')
        .height(150)
        .autoPlay(true)

景区详情页面:
在这里插入图片描述

详情富文本组件

 RichText("<html>"+this.head+"<body style='font-size:48px'>"+this.product.content+"</body></html>")
        .width('100%')
        .margin({top:20})

景区分类页面:

在这里插入图片描述

我的订单页面:
在这里插入图片描述
旅游知识问答:

在这里插入图片描述

社区交流

在这里插入图片描述
个人中心:

在这里插入图片描述

5 项目全部代码

如果需要该项目全部代码的小伙伴, lx 博主，项目源码安装部署运行, 项目讲解，项目开发，项目调试, 答辩指导操作都可. 博主专业工程师10年。对APP，小程序，大数据，AI领域研究颇深。

最后谢谢各位小伙伴的阅读，希望能给大家提供开发上面的一些思路和帮助。

最后祝福各位同伴，生活愉快，心想事成，天天开心，幸福美满 !

基于鸿蒙的旅游APP 前端和后端 课设 毕设 大作业实训指导项目

鸿蒙旅游APP前后端项目

1 项目概述

2 项目技术和开发工具

3 数据库设计

4 功能效果图

5 项目全部代码

基于鸿蒙的旅游APP 前端和后端课设毕设大作业实训指导项目