分布式開發(fā)醫(yī)療掛號(hào)系統(tǒng)數(shù)據(jù)字典模塊前后端實(shí)現(xiàn)

數(shù)據(jù)字典可以管理系統(tǒng)常用的分類數(shù)據(jù)或 固定數(shù)據(jù),例如:省市區(qū)三級(jí)聯(lián)動(dòng)數(shù)據(jù)、民族數(shù)據(jù)、行業(yè)數(shù)據(jù)、學(xué)歷數(shù)據(jù)等。由于我們的 分布式醫(yī)療掛號(hào)系統(tǒng) 大量使用這種數(shù)據(jù),所有我們要做一個(gè)數(shù)據(jù)管理,方便管理系統(tǒng)數(shù)據(jù),并且在一般的系統(tǒng)中基本都會(huì)做數(shù)據(jù)管理。
數(shù)據(jù)字典主要功能:使系統(tǒng)中的各項(xiàng)數(shù)據(jù)變的更加的嚴(yán)格,這樣有利于降低因?yàn)閿?shù)據(jù)問(wèn)題而導(dǎo)致的bug。
一、后端接口
1.數(shù)據(jù)庫(kù)表設(shè)計(jì)
數(shù)據(jù)字典的數(shù)據(jù)庫(kù)表字段和對(duì)應(yīng)的實(shí)體類的屬性應(yīng)該是一一對(duì)應(yīng)的,但要注意下面兩個(gè)地方:
添加上@TableLogic表示為邏輯刪除,后續(xù)刪除操作會(huì)自動(dòng)變?yōu)樾薷牟僮?。為了?shí)現(xiàn)頁(yè)面上單擊展開子節(jié)點(diǎn)的功能,額外使用@TableField(exist = false)加入ha’s’Children屬性。

2.編寫三層調(diào)用
根據(jù)下圖總結(jié)的三層調(diào)用關(guān)系,我們需要分別編寫好Controlller層、Service層、Mapper層的代碼。

Controller層
通過(guò)url:/admin/cmn/dict/findChildData/{id} 訪問(wèn)資源到達(dá)控制層后,控制層調(diào)用服務(wù)層的findChildData(Long id)方法。
@Api(tags = "數(shù)據(jù)字典接口")
@RestController
@RequestMapping("/admin/cmn/dict")
@CrossOrigin
public class DictController {
@Autowired
private DictService dictService;
@ApiOperation(value = "根據(jù)id查詢子數(shù)據(jù)列表")
@GetMapping("findChildData/{id}")
public Result findChildData(@PathVariable Long id) {
List<Dict> list = dictService.findChildData(id);
return Result.ok(list);
}
}
Service層
在服務(wù)層根據(jù)id查詢子數(shù)據(jù)列表,調(diào)用數(shù)據(jù)層的查詢方法查到子數(shù)據(jù)集合后,將集合遍歷,遍歷過(guò)程中為每條記錄的hasChildren屬性賦值。具體業(yè)務(wù)邏輯詳見下面的代碼:
Service接口繼承IService<T>接口:
public interface DictService extends IService<Dict> {
/**
* 根據(jù)id查詢子數(shù)據(jù)列表
* @param id
* @return list
*/
List<Dict> findChildData(Long id);
}
Service實(shí)現(xiàn)類繼承ServiceImpl<TMapper, T>類:
@Service
public class DictServiceImpl extends ServiceImpl<DictMapper, Dict> implements DictService {
/**
* 根據(jù)id查詢子數(shù)據(jù)列表
* @param id
* @return list
*/
@Override
public List<Dict> findChildData(Long id) {
QueryWrapper<Dict> queryWrapper = new QueryWrapper<>();
queryWrapper.eq("parent_id", id);
List<Dict> dictList = baseMapper.selectList(queryWrapper);
for (Dict dict : dictList) {
// 得到每一條記錄的id值
Long dictId = dict.getId();
// 調(diào)用hasChildren方法判斷是否包含子節(jié)點(diǎn)
boolean flag = this.hasChildren(dictId);
// 為每條記錄設(shè)置hasChildren屬性
dict.setHasChildren(flag);
}
return dictList;
}
/**
* 判斷id下面是否有子結(jié)點(diǎn)
* @param id
* @return true:有子結(jié)點(diǎn),false:無(wú)子結(jié)點(diǎn)
*/
private boolean hasChildren(Long id) {
QueryWrapper<Dict> queryWrapper = new QueryWrapper<>();
queryWrapper.eq("parent_id", id);
Integer count = baseMapper.selectCount(queryWrapper);
return count > 0;
}
}
Mapper層
Mapper接口繼承了BaseMapper<T>接口。由于服務(wù)層調(diào)用的方法是BaseMapper自帶的方法,所以在數(shù)據(jù)層,我們并沒有給出具體的方法。
public interface DictMapper extends BaseMapper<Dict> {
}
由于在數(shù)據(jù)字典模塊中配置類、配置文件不是我們主要研究的內(nèi)容,所以這里不再給出,具體可參考github倉(cāng)庫(kù)代碼。至此,數(shù)據(jù)字典模塊的后端接口已經(jīng)完成:

二、前端頁(yè)面
1.添加路由
由于數(shù)據(jù)管理中的數(shù)據(jù)字典是一個(gè)全新的頁(yè)面,我們可以將數(shù)據(jù)字典的路由設(shè)置為/cmn/list,路由到/cmn/list后,會(huì)跳轉(zhuǎn)到/views/dict/list.js資源。
// 數(shù)據(jù)字典路由
{
path: '/cmn',
component: Layout,
redirect: '/cmn/list',
name: '數(shù)據(jù)管理',
meta: { title: '數(shù)據(jù)管理', icon: 'example' },
// 如果只有一級(jí)會(huì)僅顯示子按鈕,添加alwaysShow=true 可以使父按鈕也顯示
alwaysShow:true,
children: [
{
path: 'list',
name: '數(shù)據(jù)字典',
component: () => import('@/views/dict/list'),
meta: { title: '數(shù)據(jù)字典', icon: 'table' }
}
]
},
2.添加跳轉(zhuǎn)頁(yè)面
路由后,跳轉(zhuǎn)到/views/dict/list.js頁(yè)面,下面給出此頁(yè)面的邏輯片段代碼和其調(diào)用的api接口代碼:

3.頁(yè)面表格渲染
表格渲染我們使用elementUI提供開發(fā)文檔:樹形數(shù)據(jù)與懶加載表格組件。
修改后的代碼如下:
:data=“list”
查出來(lái)的數(shù)據(jù)。
:load=“getChildrens”
加載getChildrens方法。
:tree-props="{ children: ‘children’, hasChildren: ‘hasChildren’ }"
樹的屬性值,通過(guò)屬性值來(lái)判斷hasChildren中的值是true還是false。
<template>
<div class="app-container">
<el-table
:data="list"
:load="getChildrens"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
style="width: 100%"
row-key="id"
border
lazy>
<el-table-column label="名稱" width="230" align="left">
<template slot-scope="scope">
<span>{{ scope.row.name }}</span>
</template>
</el-table-column>
<el-table-column label="編碼" width="220">
<template slot-scope="{ row }">
{{ row.dictCode }}
</template>
</el-table-column>
<el-table-column label="值" width="230" align="left">
<template slot-scope="scope">
<span>{{ scope.row.value }}</span>
</template>
</el-table-column>
<el-table-column label="創(chuàng)建時(shí)間" align="center">
<template slot-scope="scope">
<span>{{ scope.row.createTime }}</span>
</template>
</el-table-column>
</el-table>
</div>
</template>
三、標(biāo)準(zhǔn)Debug流程
目前數(shù)據(jù)字典模塊的前后端已經(jīng)開發(fā)完成了,但是此刻如果允許程序,頁(yè)面并不會(huì)加載到后端傳過(guò)來(lái)的數(shù)據(jù)。因?yàn)椴煌脑L問(wèn)請(qǐng)求訪問(wèn)到不同的服務(wù)器中,我們?yōu)閿?shù)據(jù)字典模塊設(shè)置端口是8202,而前端config/dev.env.js中,配置的是之前醫(yī)院設(shè)置模塊中的8201端口。
我們可以加入Nginx暫時(shí)解決,后期也會(huì)加入路由來(lái)替換掉Nginx,不過(guò)僅為了展示效果,這里簡(jiǎn)單的將前端 config/dev.env.js 中的端口改為和數(shù)據(jù)字典模塊8202統(tǒng)一的端口。關(guān)于Nginx和添加統(tǒng)一路由會(huì)在后續(xù)的文章中進(jìn)行介紹。
至此,數(shù)據(jù)字典模塊的初步功能就已經(jīng)實(shí)現(xiàn)完成了。
以上就是分布式開發(fā)醫(yī)療掛號(hào)系統(tǒng)數(shù)據(jù)字典模塊前后端實(shí)現(xiàn)的詳細(xì)內(nèi)容,更多關(guān)于分布式醫(yī)療掛號(hào)系統(tǒng)數(shù)據(jù)字典模塊前后端的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!
- 分布式醫(yī)療掛號(hào)系統(tǒng)整合Gateway網(wǎng)關(guān)解決跨域問(wèn)題
- 分布式醫(yī)療掛號(hào)系統(tǒng)Nacos微服務(wù)Feign遠(yuǎn)程調(diào)用數(shù)據(jù)字典
- 實(shí)戰(zhàn)分布式醫(yī)療掛號(hào)系統(tǒng)開發(fā)醫(yī)院科室及排班的接口
- 分布式醫(yī)療掛號(hào)系統(tǒng)SpringCache與Redis為數(shù)據(jù)字典添加緩存
- 分布式醫(yī)療掛號(hào)系統(tǒng)EasyExcel導(dǎo)入導(dǎo)出數(shù)據(jù)字典的使用
- 實(shí)戰(zhàn)分布式醫(yī)療掛號(hào)系統(tǒng)登錄接口整合阿里云短信詳情
相關(guān)文章
Java 實(shí)戰(zhàn)項(xiàng)目錘煉之樸素風(fēng)格個(gè)人博客系統(tǒng)的實(shí)現(xiàn)流程
讀萬(wàn)卷書不如行萬(wàn)里路,只學(xué)書上的理論是遠(yuǎn)遠(yuǎn)不夠的,只有在實(shí)戰(zhàn)中才能獲得能力的提升,本篇文章手把手帶你用Java+vue+Springboot+ssm+mysql+maven+redis實(shí)現(xiàn)一個(gè)樸素風(fēng)格的個(gè)人博客系統(tǒng),大家可以在過(guò)程中查缺補(bǔ)漏,提升水平2021-11-11
Java中notify和notifyAll的區(qū)別及何時(shí)使用
本文主要介紹了Java中notify和notifyAll的區(qū)別及何時(shí)使用,文中通過(guò)示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-09-09
java對(duì)接支付寶支付項(xiàng)目的實(shí)戰(zhàn)記錄
最近公司有一個(gè)需求是接入第三方支付(微信&支付寶),我接到了支付寶支付,所以下面這篇文章主要給大家介紹了關(guān)于java對(duì)接支付寶支付項(xiàng)目的相關(guān)資料,需要的朋友可以參考下2022-06-06
springboot配置多數(shù)據(jù)源并集成Druid和mybatis的操作
這篇文章主要介紹了springboot配置多數(shù)據(jù)源并集成Druid和mybatis的操作,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2021-07-07
SpringBoot集成Swagger2生成接口文檔的方法示例
我們提供Restful接口的時(shí)候,API文檔是尤為的重要,它承載著對(duì)接口的定義,描述等,本文主要介紹了SpringBoot集成Swagger2生成接口文檔的方法示例,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2018-12-12
Jmeter跨線程組傳值調(diào)用實(shí)現(xiàn)圖解
這篇文章主要介紹了Jmeter跨線程組傳值調(diào)用實(shí)現(xiàn)圖解,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-07-07

