CodeWave学习笔记--博物馆预约管理系统

场馆信息管理页面搭建(PC)

首先是场馆实体的创建

页面的搭建

在总览界面下创建子界面venueManage界面

现在总览页中实现跳转场馆管理子界面

设计场馆管理界面

效果

访客预约申请页面搭建(H5)

添加H5端,点击确认即可

在index页面下创建子页面

拖入一个标签栏,对标签栏进行修改

然后进行访客预约申请的操作,先创建四个线性布局,然后直接把实体拖进来。选择网格的形式(每行展示一个)然后拖入带图片的卡片

效果实现,但是网格长度太小了重新设置一下

预约流程梳理与相关实体创建

需要创建俩个实体,一个存放访客信息(Visitor) 另一个存放预约记录(VisitRecord)

我们需要将这俩个实体相连起来

我们同时也需要知道你预约的是那个场馆,因此也需要将场馆Venue也关联起来

这里因为需要使用到status因此需要用枚举

页面搭建

在组件中找到弹出层组件,并把访客信息拖拽进去。找到创建模板

拖入一个创建日期组件,并使用visitDate用来存储他

并把值给绑定上,还需要修改一下验证条件

例如手机号的验证可以在添加这条

设计成这个样子

进行逻辑的书写

取消

当点击取消按钮的时候,直接清空visitor的值。然后在调用弹出层的close关闭事件

点击预约,打开pop弹出层

这里我们要做俩件事情。首先我们要获取到我们页面上这个预约按钮对应的场馆信息,关联到我们的场馆

我们创建一个局部变量用来表示我们当前预约的这个场馆的Id,接下来就是当点击预约的时候对这个场馆ID进行赋值

效果实现

预约功能实现--逻辑编写(H5)

在这个保存到数据库的业务逻辑之前要考虑到访客信息是否已经预约过

通过身份证号,查询是否存在改访客信息

     存在:不需要进行访客信息的保存

     不存在:保存访客信息

在服务器端书写查询逻辑

查询内容

筛选条件

立即预约下创建局部变量用来存放查询到的数据

左边如果等于0就是说不存在改访客信息 ,则执行创建访客记录,并用一个变量visitorTemp来接收它

如果有记录那么就把获取到记录赋值给visitorTemp

对预约记录的信息进行保存

记录赋值完后,在进行记录的保存执行的是visitRecord的create事件

最后弹出层的关闭,表单的记录清空

还需要对日期设置最小日期,不能让他选择之前的日期

给最小日期绑定了当前日期。那么最小只能选到今天了

预约记录查询功能实现(H5)

创建一个子页面(预约查询)

并且设置立即预约按钮填写后跳转逻辑

然后是静态界面的搭建

这里运用到了新的组件(搜索框)

这里有一个思路,就是在上个界面直接带入这个身份证的参数(预约查询界面设置一个输入参数)

然后返回到访客预约按钮中的立即预约,并把参数传进去

这里要注意的是先传参,然后在清空。把顺序换一下

审批状态通过标签实现 通过显示条件是否于枚举相同来显示与隐藏

存在问题,拿不到场馆名称,是下面这块立即预约的赋值写错了

 

搞定没有问题 

但这里也有问题,我是张三,因此只展示我的记录。而不是所有的记录,因此需要筛选

定位到他的查询语句

添加筛选 身份证相同

把从其他页面传入过来的身份证信息赋值上

还有一个查询按钮的逻辑,只需要对数据表格进行刷新即可

预约记录管理(PC)

创建子页面

界面设计没有问题 现在我们要进行四个逻辑筛选操作

新建俩个局部变量,用来绑定俩个输入框 

写手机号与场馆名称的筛选条件

找loadRecordManageTableView_1设置俩个输入参数

按照他这种形式做一个嵌套

这里我们使用模糊查询的方式

然后把俩个局部变量拖进去即可

 

 效果实现

批量更新预约记录状态(PC)

如果预约的人比较多,一个个改比较麻烦。这里可以使用批量的修改

新建一个局部变量用来存放多选后的id 

可以参观按钮逻辑设计

 左边是没有选中idList为空。那么右边的逻辑就说明了idList里面有数据了,我们需要在服务器中书写逻辑用来匹配

 数据源

筛选条件这样就能把idList里面的数据全部查询出来了 

回到逻辑当中,新建一个变量来承接我们当当查询出来的数据 

这样我们就拿到了idList

 通过循环对里面的所有数据进行赋值

在新建一个结果list来接收赋值完后的数据

 调用逻辑,更新数据(这里不在循环里面更新是防止多次调用,浪费资源)

效果实现

同理设置不可参观按钮的逻辑

复制可以参观逻辑到不可参观中,对里面的赋值修改一下

 效果实现

公告管理页搭建(PC)

先创建一个公共的实体

 公告栏的状态类型设置为枚举

创建子界面

 这里用到了一个新的组件,富文本(扩展里面)

公告创建与修改逻辑编写(PC)

当我们创建一个公共页的时候,默认给他展示为公告页展示

修改理解创建按钮的逻辑

 他意思是说在表单验证后,保存到数据库中。那么我们就需要在保存数据库之前就把表单的内容进行修改

提交修改按钮逻辑

 修改表单之后我们需要进行判断,因为h5端只能显示一个界面

判断input是否为首页展示

 

查询到状态为首页展示的数据

 新建一个局部变量用于保存我们刚刚查询到的数据

不为0说明数据库中存在首页展示的公告,接下来的操作就是把数据库里面的拿出来对比一下是不是这个公告

 等于就是我们修改的这一条,不等于就是不是我们修改的那条(因为首页只能展示一条公告因此需要断开)

ok搞定

 然后发现有问题,可以有俩个首页展示这是错误的。修改

这里的条件弄错了,所有的操作都是满足的首页展示下进行的 

效果实现 

详情与删除功能完善(PC)

就是查看详情与删除的二次确认的开发

现在,我们需要创建一个局部变量用于存放这条表单项的详情信息

 点击详情,拿到数据并赋值 并调用打开弹窗事件

详情页面设计如上,注意的一点。不需要底部按钮。可以在弹窗的属性当中把底部栏关闭即可

 现在对删除确认进行开发

 点击删除文本逻辑如上

弹窗确认逻辑如上

 效果实现

公共轮播标题设置(H5)

这里我们需要用到这个通知栏组件

 首页进入时,进行首页展示的公告查询

创建一个局部变量用来保存查询到的信息

如果等于0就说明不存在首页展示状态的公告

 在首页中创建一个局部变量用于存放这个公告栏信息

获取到这条公告,然后在给这个通知栏绑定变量

 在前端全局变量(其他界面也需要用到)中设置一个变量用来控制通知栏的显示隐藏

逻辑如上

效果实现

公告详情页开发(H5)

类型选择链接 这样就能点击公告栏跳转到公共详情页 

界面是这样的,我们需要一个输入参数,告诉这个详情界面是那个?

我们通过这个传过来的id来查询到这条公告

 

然后回到首页把这个id传进入所有下架

我们继续完善,在公共详情当中所有非下架的数据也显示出来

 把公告实体中间拖进来

找到这个实体的数据源,进去 

 需要降序排序

点击卡片对卡片里面的数据也要进行修改 

这样它就获取到了我们点击这一行的这一条数据

OK界面完成

参观数据统计(PC)

创建一个数据展示页,并设计界面

 书写获取数量统计逻辑 那么我们首先需要查询到这些数据

数据源

 筛选条件 数据库里的类型等于输入的类型

之后想要统计数量可以来到分组聚合,因为我们需要计数,因此需要用到计数函数

回到页面在对这些数据进行绑定。因为是三个数据,因此需要创建三个变量用来存储这些数据 

然后给这个界面设置一个进入时的事件,依此对三个变量进行赋值

 

 效果实现

图表基础使用(PC)

在组件的扩展当中直接拖出你需要的图表

图表需要数据源,因此我们需要书写逻辑

 

而我们统计是每天的已参观数量

 

我们需要对每天的日期进去分组 计数

接下来我们就需要把这个查询到的数据作为一个数据源来给到我们的图表

书写一个逻辑用来存储当当拿到的数据,并把它绑定上柱形的数据源

 设置柱状图的维度(X轴)和度量(Y轴) 

效果如上,同理设置折线图和饼图

 现在展示的都是每日参观人数

图表属性当中的标题指的是下载后的名称

完整效果展示

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://xiahunao.cn/news/2778445.html

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

Dubbo源码一:【Dubbo与Spring整合】

正常在项目中,我们都是在Spring环境下使用Dubbo,所以我们这里就在Spring的环境下看看Dubbo是如何运作的 入口 在源码下载下来之后,有一个dubbo-demo目录,里面有一个基于spring注解的子目录dubbo-demo-annotation, 里面有一个生产…

第三百一十六回

[tod] 我们在上一章回中介绍了"如何在输入框中处理光标"相关的内容,本章回中将介绍如何添加输入框默认值.闲话休提,让我们一起Talk Flutter吧。 1. 概念介绍 在项目中经常使用输入框获取用户输入的内容,有时候在输入框中反复输入相…

【数学建模】【2024年】【第40届】【MCM/ICM】【E题 财产保险的可持续性】【解题思路】

一、题目 (一) 赛题原文 2024 ICM Problem E: Sustainability of Property Insurance Extreme-weather events are becoming a crisis for property owners and insurers. The world has endured “more than $1 trillion in damages from more than …

appears to be hung in Auto SQL Tuning task

appears to be hung in Auto SQL Tuning task Oracle 自动定时优化任务执行失败分析 错误现象: Sat Feb 10 03:10:57 2024 Process 0x0x00007FFB81BE44A8 appears to be hung in Auto SQL Tuning task Current time 1707505857, process death time 1707505803 …

Redisson分布式锁 原理 + 运用 记录

Redisson 分布式锁 简单入门 pom <dependency><groupId>org.redisson</groupId><artifactId>redisson</artifactId><version>3.13.6</version></dependency>配置类 package com.hmdp.config;import org.redisson.Redisson;…

【Spring MVC篇】参数的传递及json数据传参

个人主页&#xff1a;兜里有颗棉花糖 欢迎 点赞&#x1f44d; 收藏✨ 留言✉ 加关注&#x1f493;本文由 兜里有颗棉花糖 原创 收录于专栏【Spring MVC】 本专栏旨在分享学习Spring MVC的一点学习心得&#xff0c;欢迎大家在评论区交流讨论&#x1f48c; 目录 一、普通参数的传…

CVE-2012-1823 漏洞复现

CVE-2012-1823 PHP SAPI 与运行模式 首先&#xff0c;介绍一下PHP的运行模式。 下载PHP源码&#xff0c;可以看到其中有个目录叫sapi。sapi在PHP中的作用&#xff0c;类似于一个消息的“传递者”&#xff0c;比如在《Fastcgi协议分析 && PHP-FPM未授权访问漏洞 &…

【算法与数据结构】496、503、LeetCode下一个更大元素I II

文章目录 一、496、下一个更大元素 I二、503、下一个更大元素II三、完整代码 所有的LeetCode题解索引&#xff0c;可以看这篇文章——【算法和数据结构】LeetCode题解。 一、496、下一个更大元素 I 思路分析&#xff1a;本题思路和【算法与数据结构】739、LeetCode每日温度类似…

论文笔记:相似感知的多模态假新闻检测

整理了RecSys2020 Progressive Layered Extraction : A Novel Multi-Task Learning Model for Personalized Recommendations&#xff09;论文的阅读笔记 背景模型实验 论文地址&#xff1a;SAFE 背景 在此之前&#xff0c;对利用新闻文章中文本信息和视觉信息之间的关系(相似…

在Ubuntu22.04上部署ComfyUI

ComfyUI 是 一个基于节点流程的 Stable Diffusion 操作界面&#xff0c;可以通过流程&#xff0c;实现了更加精准的工作流定制和完善的可复现性。每一个模块都有特定的的功能&#xff0c;我们可以通过调整模块连接达到不同的出图效果&#xff0c;特点如下&#xff1a; 1.对显存…

二十、K8S-1-权限管理RBAC详解

目录 k8s RBAC 权限管理详解 一、简介 二、用户分类 1、普通用户 2、ServiceAccount 三、k8s角色&角色绑定 1、授权介绍&#xff1a; 1.1 定义角色&#xff1a; 1.2 绑定角色&#xff1a; 1.3主体&#xff08;subject&#xff09; 2、角色&#xff08;Role和Cluster…

【正在更新】从零开始认识语音识别:DNN-HMM混合系统语音识别(ASR)原理

摘要 | Abstract TO-BE-FILLED 1.前言 | Introduction 近期想深入了解语音识别(ASR)中隐马尔可夫模型(HMM)和深度神经网络-隐马尔可夫(DNN-HMM)混合模型&#xff0c;但是尽管网络上有许多关于DNN-HMM的介绍&#xff0c;如李宏毅教授的《深度学习人类语言处理》[1]&#xff0c;…

Hive-架构与设计

架构与设计 一、背景和起源二、框架概述1.设计特点 三、架构图1.UI交互层2.Driver驱动层3.Compiler4.Metastore5.Execution Engine 四、执行流程1.发起请求2.获取执行计划3.获取元数据4.返回元数据5.返回执行计划6.运行执行计划7.运行结果获取 五、数据模型1.DataBase数据库2.T…

Elasticsearch 通信模块的分析

Elasticsearch 通信模块的分析 - 知乎 Elasticsearch是一个基于Lucene的分布式实时搜索框架&#xff0c;它本身能够接受用户发来的http 请求&#xff0c; 集群节点之间也会有相关的通信。 通信模块的简介 Elasticsearch 中的通信相关的配置都是由NetworkModule 这个类完成的…

【深度学习】:实验6布置,图像自然语言描述生成(让计算机“看图说话”)

清华大学驭风计划 因为篇幅原因实验答案分开上传&#xff0c;深度学习专栏持续更新中&#xff0c;期待的小伙伴敬请关注 实验答案链接http://t.csdnimg.cn/bA48U 有任何疑问或者问题&#xff0c;也欢迎私信博主&#xff0c;大家可以相互讨论交流哟~~ 案例 6 &#xff1a;图像自…

【RabbitMQ(二)】:Exchange 详解 | Message Convert 消息转换器

文章目录 03. 使用 Java 代码去操控 RabbitMQ3.1 快速入门3.1.1 创建父子项目3.1.2 编写代码 3.2 Work 模型3.3 RabbitMQ 中的三类交换机3.3.1 Fanout 扇出交换机3.3.2 Direct 交换机3.3.3 Topic 交换机 3.4 声明队列交换机3.4.1 方式一&#xff1a;书写 Config 类3.4.2 方式二…

如何将 Hexo 部署到 GitHub Pages

引言 在数字时代&#xff0c;拥有个人博客是展示自己想法、分享知识和技能的绝佳方式。Hexo 是一个基于 Node.js 的静态博客生成器&#xff0c;它结合了简洁性和功能性&#xff0c;让我们可以轻松地建立并维护一个博客。而 GitHub Pages 提供了一个免费的平台来托管这些静态网站…

推荐几个Python爬虫接单渠道

前言 平时工作有闲的家人们&#xff0c;今天给大家推荐一些用Python爬虫做私活的渠道&#xff01; 【Python爬虫学习资料】 先给各位还不熟悉Python爬虫的朋友介绍一下&#xff01; 可以短时间获得大量资料~ 可以进一步数据分析 当然也可以获得收益&#xff01; 学会Python…

物资捐赠管理系统

文章目录 物资捐赠管理系统一、项目演示二、项目介绍三、系统部分功能截图四、部分代码展示五、底部获取项目&#xff08;9.9&#xffe5;带走&#xff09; 物资捐赠管理系统 一、项目演示 爱心捐赠系统 二、项目介绍 基于springboot的爱心捐赠管理系统 开发语言&#xff1a…

Spring基础 - SpringMVC请求流程和案例

Spring基础 - SpringMVC请求流程和案例 什么是MVC 用一种业务逻辑、数据、界面显示分离的方法&#xff0c;将业务逻辑聚集到一个部件里面&#xff0c;在改进和个性化定制界面及用户交互的同时&#xff0c;不需要重新编写业务逻辑。MVC被独特的发展起来用于映射传统的输入、处理…