feat: 系统日志支持按描述搜索

This commit is contained in:
meilin.huang
2023-07-04 14:13:47 +08:00
parent fa58f6d2de
commit e3f4c298b0
5 changed files with 62 additions and 27 deletions

View File

@@ -11,7 +11,7 @@
<div class="query" ref="queryRef">
<div>
<div v-if="props.query.length > 0">
<el-form :model="props.queryForm" label-width="auto">
<el-form :model="props.queryForm" label-width="auto" :size="props.size">
<el-row v-for="i in Math.ceil((props.query.length + 1) / (defaultQueryCount + 1))" :key="i"
v-show="i == 1 || isOpenMoreQuery" :class="i > 1 && isOpenMoreQuery ? 'is-open' : ''">
@@ -63,14 +63,14 @@
</div>
<template #reference>
<!-- 一个Element Plus中的图标 -->
<el-button icon="Operation"></el-button>
<el-button icon="Operation" :size="props.size"></el-button>
</template>
</el-popover>
</div>
</div>
<el-table v-bind="$attrs" max-height="700" @selection-change="handleSelectionChange" :data="props.data" border
highlight-current-row v-loading="loadingData">
highlight-current-row v-loading="loadingData" :size="props.size">
<el-table-column v-if="props.showSelection" type="selection" width="40" />
@@ -93,7 +93,8 @@
</el-table>
<el-row style="margin-top: 20px" type="flex" justify="end">
<el-pagination @current-change="handlePageChange" @size-change="handleSizeChange" style="text-align: right"
<el-pagination :small="props.size == 'small'" @current-change="handlePageChange"
@size-change="handleSizeChange" style="text-align: right"
layout="prev, pager, next, total, sizes, jumper" :total="props.total"
v-model:current-page="state.pageNum" v-model:page-size="state.pageSize"
:page-sizes="[10, 15, 20, 25]" />
@@ -109,6 +110,14 @@ import { TableColumn, TableQuery } from './index';
const emit = defineEmits(['update:queryForm', 'update:pageNum', 'update:pageSize', 'update:selectionData', 'pageChange'])
const props = defineProps({
size: {
type: String,
default: "",
},
inputWidth: {
type: [Number, String],
default: 0,
},
// 是否显示选择列
showSelection: {
type: Boolean,
@@ -141,6 +150,13 @@ const props = defineProps({
type: [Number],
default: 10,
},
// 查询条件配置
query: {
type: Array<TableQuery>,
default: function () {
return [];
}
},
// 绑定的查询表单
queryForm: {
type: Object,
@@ -148,13 +164,6 @@ const props = defineProps({
return {};
}
},
// 查询条件配置
query: {
type: Array<TableQuery>,
default: function () {
return [];
}
}
})
const state = reactive({
@@ -166,6 +175,8 @@ const state = reactive({
defaultQueryCount: 2, // 默认显示的查询参数个数展开后每行显示个数为该值加1。第一行用最后一列来占用按钮
queryForm: {} as any,
loadingData: false,
// 输入框宽度
inputWidth: "200px" as any,
})
const {
@@ -173,6 +184,7 @@ const {
defaultQueryCount,
queryForm,
loadingData,
inputWidth,
} = toRefs(state)
watch(() => props.queryForm, (newValue: any) => {
@@ -195,13 +207,19 @@ watch(() => props.data, (newValue: any) => {
}
})
}
state.loadingData = false;
})
onMounted(() => {
state.pageNum = props.pageNum;
state.pageSize = props.pageSize;
state.queryForm = props.queryForm;
// 如果没传输入框宽度则根据组件size设置默认宽度
if (!props.inputWidth) {
state.inputWidth = props.size == "small" ? "150px" : "200px"
} else {
state.inputWidth = props.inputWidth;
}
})
const getRowQueryItem = (row: number) => {
@@ -231,16 +249,25 @@ const handleSizeChange = () => {
}
const queryData = () => {
changePageNum(1);
execQuery();
}
const reset = () => {
// 触发重新调用查询接口即可
state.queryForm = {};
emit('update:queryForm', state.queryForm)
// 将查询参数绑定的值置空,并重新粗发查询接口
for (let qi of props.query) {
state.queryForm[qi.prop] = null;
}
changePageNum(1);
emit('update:queryForm', state.queryForm);
execQuery();
}
const changePageNum = (pageNum: number) => {
state.pageNum = pageNum;
emit('update:pageNum', state.pageNum)
}
const execQuery = () => {
emit("pageChange")
}
@@ -286,15 +313,19 @@ defineExpose({ loading })
font-weight: bold;
}
.el-input {
width: 200px;
}
.el-select-v2 {
width: 200px;
width: v-bind(inputWidth);
}
::v-deep(.el-date-editor) {
.el-input {
width: v-bind(inputWidth);
}
.el-select {
width: v-bind(inputWidth);
}
.el-date-editor {
width: 380px !important;
}
</style>

View File

@@ -273,7 +273,7 @@ const getFiles = async () => {
state.loading = true;
state.query.id = props.machineId as any;
const res = await files.request(state.query);
state.fileTable = res.list;
state.fileTable = res.list || [];
state.total = res.total;
} finally {
state.loading = false;

View File

@@ -5,8 +5,8 @@
@pageChange="search()">
<template #selectAccount>
<el-select remote :remote-method="getAccount" v-model="query.creatorId" filterable placeholder="请输入并选择账号"
clearable class="mr5" style="width: 200px">
<el-select style="width: 200px" remote :remote-method="getAccount" v-model="query.creatorId" filterable
placeholder="请输入并选择账号" clearable>
<el-option v-for="item in accounts" :key="item.id" :label="item.username" :value="item.id">
</el-option>
</el-select>
@@ -32,6 +32,7 @@ const state = reactive({
query: {
type: null,
creatorId: null,
description: null,
pageNum: 1,
pageSize: 10,
},
@@ -41,6 +42,7 @@ const state = reactive({
{ label: "成功", value: 1 },
{ label: "失败", value: 2 },
]),
TableQuery.text("description", "描述"),
],
columns: [
TableColumn.new("creator", "操作人"),

View File

@@ -14,8 +14,9 @@ type Syslog struct {
func (r *Syslog) Syslogs(rc *req.Ctx) {
g := rc.GinCtx
condition := &entity.Syslog{
Type: int8(ginx.QueryInt(g, "type", 0)),
CreatorId: uint64(ginx.QueryInt(g, "creatorId", 0)),
Type: int8(ginx.QueryInt(g, "type", 0)),
CreatorId: uint64(ginx.QueryInt(g, "creatorId", 0)),
Description: ginx.Query(g, "description", ""),
}
rc.ResData = r.SyslogApp.GetPageList(condition, ginx.GetPageParam(g), new([]entity.Syslog), "create_time DESC")
}

View File

@@ -14,7 +14,8 @@ func newSyslogRepo() repository.Syslog {
}
func (m *syslogRepoImpl) GetPageList(condition *entity.Syslog, pageParam *model.PageParam, toEntity any, orderBy ...string) *model.PageResult[any] {
qd := gormx.NewQuery(condition).WithCondModel(condition).WithOrderBy(orderBy...)
qd := gormx.NewQuery(condition).Like("description", condition.Description).
Eq("creator_id", condition.CreatorId).Eq("type", condition.Type).WithOrderBy(orderBy...)
return gormx.PageQuery(qd, pageParam, toEntity)
}