寫在最前
如果這個項目讓你有所收獲，記得 Star 關(guān)注哦，這對我是非常不錯的鼓勵與支持。
源碼地址（后端）：https://gitee.com/csps/mingyue-springcloud-learning
源碼地址（前端）：https://gitee.com/csps/mingyue-springcloud-ui
文檔地址：https://gitee.com/csps/mingyue-springcloud-learning/wikis
本節(jié)概要
mingyue-ui 目前與后端交互只有登錄登出接口，本節(jié)從用戶入手，完成用戶前后端交互增刪改查。
分頁查詢用戶
分頁查詢通用類
@Data
@Schema(description = "分頁查詢通用類")
public class PageCommon implements Serializable {
private static final long serialVersionUID = 1L;
@Schema(description = "分頁大小")
private Integer pageSize;
@Schema(description = "當(dāng)前頁數(shù)")
private Integer pageNum;
@Schema(description = "排序列")
private String orderByColumn;
@Schema(description = "排序的方向 desc 或者 asc")
private String isAsc;
/**
* 當(dāng)前記錄起始索引 默認(rèn)值
*/
public static final int DEFAULT_PAGE_NUM = 1;
/**
* 每頁顯示記錄數(shù) 默認(rèn)值 默認(rèn)查全部
*/
public static final int DEFAULT_PAGE_SIZE = Integer.MAX_VALUE;
public <T> Page<T> build() {
Integer pageNum = ObjectUtil.defaultIfNull(getPageNum(), DEFAULT_PAGE_NUM);
Integer pageSize = ObjectUtil.defaultIfNull(getPageSize(), DEFAULT_PAGE_SIZE);
if (pageNum <= 0) {
pageNum = DEFAULT_PAGE_NUM;
}
Page<T> page = new Page<>(pageNum, pageSize);
List<OrderItem> orderItems = buildOrderItem();
if (CollUtil.isNotEmpty(orderItems)) {
page.addOrder(orderItems);
}
return page;
}
/**
* 構(gòu)建排序
*
* 支持的用法如下: {isAsc:"asc",orderByColumn:"id"} order by id asc
* {isAsc:"asc",orderByColumn:"id,createTime"} order by id asc,create_time asc
* {isAsc:"desc",orderByColumn:"id,createTime"} order by id desc,create_time desc
* {isAsc:"asc,desc",orderByColumn:"id,createTime"} order by id asc,create_time desc
*/
private List<OrderItem> buildOrderItem() {
if (StrUtil.isBlank(orderByColumn) || StrUtil.isBlank(isAsc)) {
return null;
}
String orderBy = SqlUtil.escapeOrderBySql(orderByColumn);
orderBy = StrUtil.toUnderlineCase(orderBy);
String[] orderByArr = orderBy.split(StrUtil.COMMA);
String[] isAscArr = isAsc.split(StrUtil.COMMA);
if (isAscArr.length != 1 && isAscArr.length != orderByArr.length) {
throw new ServiceException("排序參數(shù)有誤");
}
List<OrderItem> list = new ArrayList<>();
// 每個字段各自排序
for (int i = 0; i < orderByArr.length; i++) {
String orderByStr = orderByArr[i];
String isAscStr = isAscArr.length == 1 ? isAscArr[0] : isAscArr[i];
if ("asc".equals(isAscStr)) {
list.add(OrderItem.asc(orderByStr));
}
else if ("desc".equals(isAscStr)) {
list.add(OrderItem.desc(orderByStr));
}
else {
throw new ServiceException("排序參數(shù)有誤");
}
}
return list;
}
}
接口層
@GetMapping("list")
@SaCheckPermission("system:user:list")
@Operation(summary = "獲取所有用戶信息")
public R<IPage<SysUserVo>> getSysUsers(PageCommon page, UserQueryDto dto) {
return R.ok(sysUserService.getSysUsers(page, dto));
}
邏輯層
@Override
public IPage<SysUserVo> getSysUsers(PageCommon page, UserQueryDto dto) {
return sysUserMapper.getUserVosPage(page.build(), dto);
}
數(shù)據(jù)層
<select id="getUserVosPage" resultType="com.csp.mingyue.system.api.vo.SysUserVo">
SELECT su.*,sr.role_name, sr.role_code
FROM sys_user su
LEFT JOIN sys_user_role sur ON sur.user_id = su.user_id
LEFT JOIN sys_role sr ON sur.role_id = sr.role_id
<where>
su.is_deleted = '0'
<if test="query.username != null and query.username != ''">
<bind name="usernameLike" value="'%' + query.username + '%'" />
and su.username LIKE #{usernameLike}
</if>
</where>
ORDER BY su.create_time DESC
</select>
接口測試
非排序入?yún)?/p>
curl -X 'GET' \
'http://mingyue-gateway:9100/system/sysUser/list?pageSize=10&pageNum=1&username=' \
-H 'accept: */*' \
-H 'Authorization: vhiqUYS3NtT5zpvyzwudffAhyu3vswAV'
排序入?yún)?/p>
curl -X 'GET' \
'http://mingyue-gateway:9100/system/sysUser/list?pageSize=10&pageNum=2&orderByColumn=userId&isAsc=desc&username=' \
-H 'accept: */*' \
-H 'Authorization: vhiqUYS3NtT5zpvyzwudffAhyu3vswAV'
添加或編輯用戶
接口層
@PostMapping("addOrEdit")
@Operation(summary = "添加或編輯用戶")
public R<Boolean> addOrEdit(@Valid @RequestBody UserAddOrEditDto dto) {
return R.ok(sysUserService.addOrEdit(dto));
}
邏輯層
@Override
@Transactional(rollbackFor = Exception.class)
public boolean addOrEdit(UserAddOrEditDto dto) {
SysUser sysUser = BeanUtil.copyProperties(dto, SysUser.class);
// 添加用戶
if (Objects.isNull(sysUser.getUserId())) {
// 密碼加密
sysUser.setPassword(BCrypt.hashpw(sysUser.getPassword(), userPasswordProperties.getSalt()));
}
boolean flag = this.saveOrUpdate(sysUser);
if (!flag) {
throw new UserException("用戶信息保存異常");
}
// 保存角色關(guān)系
flag = sysRoleService.addUserRole(sysUser.getUserId(), dto.getRoleCode());
if (!flag) {
throw new UserException("用戶角色信息保存異常");
}
return true;
}
刪除用戶
接口層
@DeleteMapping("{userId}")
@Operation(summary = "刪除用戶", parameters = { @Parameter(name = "userId", description = "用戶ID", required = true) })
public R<Boolean> delUser(@PathVariable Long userId) {
return R.ok(sysUserService.delUser(userId));
}
邏輯層
@Override
public boolean delUser(Long userId) {
return sysUserMapper.deleteByIdLogic(userId) > 0;
}
數(shù)據(jù)層
<delete id="deleteByIdLogic">
UPDATE sys_user su SET su.is_deleted = '1' WHERE su.user_id = #{userId}
</delete>
mingyue-ui 接口交互
接口定義
list: (page: object) => {
return request({
url: '/api/system/sysUser/list',
method: 'get',
params: page
});
},
addOrEdit: (data: object) => {
return request({
url: '/api/system/sysUser/addOrEdit',
method: 'post',
data: data
});
},
del: (userId: number) => {
return request({
url: '/api/system/sysUser/' + userId,
method: 'delete'
});
}
分頁查詢
src/views/system/user/index.vue
const getTableData = async () => {
state.tableData.loading = true;
const res = await getUserList();
state.tableData.data = res.data.records;
state.tableData.total = res.data.total;
state.tableData.loading = false;
};
添加或編輯用戶
src/views/system/user/dialog.vue
const onSubmit = () => {
userApi().addOrEdit(state.ruleForm).then(res => {
if (res.data) {
closeDialog();
emit('refresh');
state.dialog.type === 'add' ? ElMessage.success('添加成功') : ElMessage.success('修改成功');
} else {
state.dialog.type === 'add' ? ElMessage.error('添加失敗') : ElMessage.error('修改失敗');
}
})
};
刪除用戶
src/views/system/user/index.vue
const onRowDel = (row: RowUserType) => {
ElMessageBox.confirm(`此操作將永久刪除賬戶名稱：“${row.username}”，是否繼續(xù)?`, '提示', {
confirmButtonText: '確認(rèn)',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
userApi().del(row.userId).then(() => {
getTableData();
ElMessage.success('刪除成功');
});
})
.catch(() => {});
};
小結(jié)
用戶管理已經(jīng)可以交互接口完成真實的增刪改查了。
目前 mingyue 已經(jīng)包含了 統(tǒng)一網(wǎng)關(guān)服務(wù)、統(tǒng)一認(rèn)證服務(wù)、統(tǒng)一系統(tǒng)服務(wù)、統(tǒng)一推送服務(wù)，距離目標(biāo)還差
統(tǒng)一文件服務(wù)、統(tǒng)一定時服務(wù)、統(tǒng)一搜索服務(wù) 等等。接下來搞一搞 統(tǒng)一文件服務(wù) 吧！文章來源：http://www.zghlxwxcb.cn/news/detail-698961.html
本人后端一枚，前端粗通，等后續(xù)后端服務(wù)基本完成后，再去抽時間完善前端代碼哈～～ 見諒《 - 。- 》文章來源地址http://www.zghlxwxcb.cn/news/detail-698961.html
到了這里，關(guān)于024-從零搭建微服務(wù)-系統(tǒng)服務(wù)（六）的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
