22.实验室首页大数据

最新推荐文章于 2024-07-10 14:03:37 发布

栗穎呀

最新推荐文章于 2024-07-10 14:03:37 发布

阅读量99

点赞数

分类专栏：智慧实验室管理系统项目vue3+springboot 文章标签：前端 json

本文链接：https://blog.csdn.net/m0_65436732/article/details/133602098

版权

智慧实验室管理系统项目vue3+springboot 专栏收录该内容

27 篇文章 1 订阅

订阅专栏

首页大数据来给用户宏观的展现我们整个地图的这些实验室被预约和正在审核中的一个预约状态。

1.首页页面的实现

创建完绑定事情我们单独走一个方法，函数式编程的一个思想

2.创建弹出框

弹出框展示不是选择位置了，我们要展示是点击的实验室的所有的预约数据，注意：预约中包含的state是0、1、2，而我们要展示的状态是0审核中和1审核通过，我们要让用户通过展示知道哪个实验室可预约的，哪个实验室不可预约。

我们现在所写的后端是在select中是只能传一个，要不0要不1，它不能或。有两种思路：第一个是让后端新写一个新的查询的映射器来帮助前端提供0或者1的，直接给前端返回固定的就是0和1，只要给后端过去lab_id，后端就给前端返回对应的0和1 的这样一个数据。第二个是让前端在发请求的时候要0的这一条请求然后再要1这一条请求，然后再再前端中去聚合这个数据。

那我们这就在不改造后端的情况下实现需求

3.Promise对象

这里的写法需要注意一下async属于顺序执行，相当于用你写同步代码的思路在这写异步，所以这是异步编程的最高境界，一定是res1走完、再走res2代码，但其实我们是希望两个请求同时发出的，到时候我们再收集数据。因为我们后端人员查询的话是一起给我们返回来的。所以我们再改写一下。基于Promise对象解决回调地狱，all是等所有的都结束之后然后再会执行。我们把它们放在数组里面。

我们要的数组是在data里面

4.map方法

用map方法映射li节点

思路：取回当前这个实验室所有需要预约的这个数据，对应的我们通过map最传统的但是也是最有效的创建代码片段的方式映射成新的li的一个节点，把日期转换成我们需要的，把我们的1234转换成我们的label第一节课第二节课等，然后对应的审核中已批准的最后变成我们的HTML片段我们直接设置在.setHTML这个位置上。