当前位置: 首页 > article >正文

医院信息化与智能化系统(10)

医院信息化与智能化系统(10)

这里只描述对应过程,和可能遇到的问题及解决办法以及对应的参考链接,并不会直接每一步详细配置
如果你想通过文字描述或代码画流程图,可以试试PlantUML,告诉GPT你的文件结构,让他给你对应的代码

预约挂号微服务模块搭建

前端知识点补充,此章节不会详细讲具体前端的每个知识点

1、EasyExcel-写操作

首先是在后端service-cmn引入相应依赖,接着创建实体类,并在对应属性上添加注解,设置表头内容

@Data
public class UserData {
    @ExcelProperty("用户编号")
    private  int uid;
    @ExcelProperty("用户名称")
    private  String username;
}

最终实现写操作代码

    public static void main(String[] args) {
        //构建数据list集合
        List<UserData> list = new ArrayList<>();
        for (int i = 0; i < 10; i++) {
            UserData data = new UserData();
            data.setUid(i);
            data.setUsername("lucy" + i);
            list.add(data);
        }
        //设置excel文件路径和文件名称
        String fileName = "C:\\Users\\666\\Desktop\\新建文件夹\\excel\\01.xlsx";

        //调用方法实现写操作
        EasyExcel.write(fileName, UserData.class).sheet("用户信息")
                .doWrite(list);
    }

最终效果
在这里插入图片描述

2、EasyExcel-读操作

首先需要创建ExcelListener类,其继承AnalysisEventListener接口,并实现invokedoAfterAllAnalysedinvokeHeadMap等方法。

  • invoke:一行一行读取数据,从第二行读取数据
  • doAfterAllAnalysed:读取后执行
  • invokeHeadMap:当你读取 Excel 文件时, 可以提供表头的名称和对应的列索引映射

在测试类使用下行代码进行excel文件读取

  EasyExcel.read(fileName, UserData.class,new ExcelListener()).sheet().doRead();

3、EasyExcel-导出操作

目的:在前端导出数据,并导出到excel

DictController里添加方法importData,输入参数为HttpServletResponse response,进行导出数据字典操作。

其中在DictService接口中声明并在DictServiceImpl实现exportDictData方法,实现具体逻辑功能。

依靠传递的repsonse对象,可以实现下载设置:

Content-disposition 头部用于指示浏览器处理响应内容的方式。attachment 表示内容应该被当作附件下载

        response.setContentType("application/vnd.ms-excel");
        response.setCharacterEncoding("utf-8");
        // 这里URLEncoder.encode可以防止中文乱码 当然和easyexcel没有关系
        String fileName = "dict";
        response.setHeader("Content-disposition", "attachment;filename="+ fileName + ".xlsx");

写操作传递的类是DictEeVo.class,它与Dict的区别是仅包含必要的字段,专注于数据的展示,去掉了与数据库操作无关的字段(如时间和删除标记),而通过baseMapper返回的是Dict类型的List,所以要进行循环赋值。

BeanUtils 提供了一个简单的方式来复制对象的属性。这个方法会将 dictEeVo 对象的属性值复制到 dict 对象中,前提是这两个对象具有相同名称和兼容类型的属性。

       for(Dict dict : dictList) {
            DictEeVo dictEeVo = new DictEeVo();
            BeanUtils.copyProperties((dict, dictEeVo);
            dictVoList.add(dictEeVo);
        }

最后在EasyExcel中写入dictVoList即可。

       EasyExcel.write(response.getOutputStream(), DictEeVo.class).sheet("dict")
                    .doWrite(dictVoList);

前端操作
list.vue放置element-ui按钮标签,其绑定方法exportData

在mehtods编写该方法

它会通过将浏览器的当前地址 (window.location.href) 设置为指定的 URL 来发起请求。

        exportData(){
            //调用导出接口
           window.location.href="http://localhost:8202/admin/cmn/dict/exportData"
        }

4、EasyExcel-导入操作

目的:在excel中写入数据,并导入到数据库

DictController里添加方法importData,输入参数为MultipartFile file,进行导入数据字典操作。

其中在DictService接口中声明并在DictServiceImpl实现importDictData方法,实现具体逻辑功能。

MultipartFile 是 Spring Framework 中的一个接口,用于处理上传的文件。它提供了对上传文件的抽象,允许开发者在控制器中轻松地处理文件上传的操作。

创建DictListener,并构造器传参basemapper,其中basemapper用来执行数据库添加操作,而操作对象只能是Dict,所以调用方法对dict进行复制操作

    public DictListener(DictSetMapper dictSetMapper) {
        this.dictSetMapper = dictSetMapper;
    }
    ...
    @Override
    public void invoke(DictEeVo dictEeVo, AnalysisContext analysisContext) {
        //调用方法添加数据库
        Dict dict = new Dict();
        BeanUtils.copyProperties(dictEeVo,dict);
        dictSetMapper.insert(dict);
    }

前端处理

在导出的element-ui代码下面添加一行导入标签代码,其绑定方法importData

还希望在导入时,能出现一个弹窗,还是需要在<temple>中添加相关代码(放在table标签后)

dialogImportVisible在默认值设置为false,当其为true时,弹窗出现

:multiple是否上传多个组件

:on-success="onUploadSuccess"上传成功调用该方法,该方法设置执行关闭弹窗刷新页面(自己编写的)

:action="'http://localhost:8202/admin/cmn/dict/importData'"点击上传时调用该方法,附url路径

<el-dialog title="导入":visible.sync="dialogImportVisible"width="480px">
<el-form label-position="right"label-width="170px">

<el-form-item label="文件">
<el-upload
:multiple="false"
:on-success="onUploadSuccess"
:action="'http://localhost:8202/admin/cmn/dict/importData'"
class="upload-demo">
<el-button size="small"type="primary">点击上传</el-button>
<div slot="tip"class="el-upload__tip">只能上传xls文件,且不超过500kb</div>
</el-upload>
</el-form-item>

</el-form>
<div slot="footer"class="dialog-footer">
<el-button @click="dialogImportVisible = false">
      取消
</el-button>
</div>
</el-dialog>

在这里插入图片描述
在数据库中,需要把is_deleted字段默认值从1改为0,不然前端显示不出来


http://www.kler.cn/news/367418.html

相关文章:

  • 在GeoTools中的Shapefile属性表读取效率之Shp与Dbf对比
  • w~自动驾驶合集6
  • 【Python爬虫实战】Selenium自动化网页操作入门指南
  • Android调用系统相机录像并设置参数
  • # 渗透测试# 安全见闻(4)操作系统与驱动程序
  • 中间件之Seata
  • Nuxt.js交流社区,欢迎加入!
  • 报表工具怎么选?山海鲸VS帆软,哪个更适合你?
  • “循环购模式:革新消费体验,解锁收益新篇章“
  • 单值集合总复习
  • MySQL-DQL练习题
  • 2024.10.27 直接插入排序 非递归后序遍历(复杂版)
  • 基于STM32的智能寝室控制系统设计(论文+源码)
  • Spring Boot环境下论坛网站的架构与优化
  • idea 无法输入中文 快速解决
  • 2024 BuildCTF 公开赛|MISC
  • 【好玩的经典游戏】Docker环境下部署网页小游戏网站
  • 媒小象 1.7.2 | 完全免费的内容创作二创工具
  • uniapp 发起post和get请求!uni.request(OBJECT)
  • PouchDB - 免费开源的 JavaScript 数据库,轻量易用,用于离线保存数据的场景
  • 联想笔记本电脑睡眠后打开黑屏解决方法
  • 路由器 相关知识
  • 【Android】浅析OkHttp(1)
  • 【动态规划】力扣 70. 爬楼梯
  • pytorch dataloader学习
  • ros机器人导航以及物体、动作识别