songjianet
3 years ago
committed by
GitHub
10 changed files with 499 additions and 87 deletions
@ -0,0 +1,27 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { axios } from '@/service/service' |
||||
import type { AuditListReq } from './types' |
||||
|
||||
export function queryAuditLogListPaging(params: AuditListReq): any { |
||||
return axios({ |
||||
url: '/projects/audit/audit-log-list', |
||||
method: 'get', |
||||
params |
||||
}) |
||||
} |
||||
@ -0,0 +1,48 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
interface AuditListReq { |
||||
pageNo: number |
||||
pageSize: number |
||||
endDate?: string |
||||
moduleType?: string |
||||
operationType?: string |
||||
processName?: string |
||||
projectName?: string |
||||
resourceType?: string |
||||
startDate?: string |
||||
userName?: string |
||||
} |
||||
|
||||
interface AuditItem { |
||||
userName: string |
||||
resource: string |
||||
operation: string |
||||
time: string |
||||
resourceName: string |
||||
} |
||||
|
||||
interface AuditListRes { |
||||
totalList: AuditItem[] |
||||
total: number |
||||
totalPage: number |
||||
pageSize: number |
||||
currentPage: number |
||||
start: number |
||||
} |
||||
|
||||
export { AuditListReq, AuditListRes } |
||||
@ -0,0 +1,26 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0 |
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
.table-card { |
||||
margin-top: 8px; |
||||
|
||||
.pagination { |
||||
margin-top: 20px; |
||||
display: flex; |
||||
justify-content: center; |
||||
} |
||||
} |
||||
@ -0,0 +1,161 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { defineComponent, onMounted, toRefs, watch } from 'vue' |
||||
import { |
||||
NSpace, |
||||
NInput, |
||||
NSelect, |
||||
NDatePicker, |
||||
NButton, |
||||
NIcon, |
||||
NDataTable, |
||||
NPagination, |
||||
NCard |
||||
} from 'naive-ui' |
||||
import { SearchOutlined } from '@vicons/antd' |
||||
import { useTable } from './use-table' |
||||
import { useI18n } from 'vue-i18n' |
||||
import Card from '@/components/card' |
||||
import styles from './index.module.scss' |
||||
|
||||
const AuditLog = defineComponent({ |
||||
name: 'audit-log', |
||||
setup() { |
||||
const { t, variables, getTableData, createColumns } = useTable() |
||||
|
||||
const requestTableData = () => { |
||||
getTableData({ |
||||
pageSize: variables.pageSize, |
||||
pageNo: variables.page, |
||||
resourceType: variables.resourceType, |
||||
operationType: variables.operationType, |
||||
userName: variables.userName, |
||||
datePickerRange: variables.datePickerRange |
||||
}) |
||||
} |
||||
|
||||
const onUpdatePageSize = () => { |
||||
variables.page = 1 |
||||
requestTableData() |
||||
} |
||||
|
||||
const onSearch = () => { |
||||
variables.page = 1 |
||||
requestTableData() |
||||
} |
||||
|
||||
onMounted(() => { |
||||
createColumns(variables) |
||||
requestTableData() |
||||
}) |
||||
|
||||
watch(useI18n().locale, () => { |
||||
createColumns(variables) |
||||
}) |
||||
|
||||
return { |
||||
t, |
||||
...toRefs(variables), |
||||
requestTableData, |
||||
onUpdatePageSize, |
||||
onSearch |
||||
} |
||||
}, |
||||
render() { |
||||
const { t, requestTableData, onUpdatePageSize, onSearch } = this |
||||
|
||||
return ( |
||||
<> |
||||
<NCard> |
||||
<NSpace justify='end'> |
||||
<NInput |
||||
v-model={[this.userName, 'value']} |
||||
size='small' |
||||
placeholder={t('monitor.audit_log.user_name')} |
||||
clearable |
||||
/> |
||||
<NSelect |
||||
v-model={[this.operationType, 'value']} |
||||
size='small' |
||||
options={[ |
||||
{ value: 'CREATE', label: t('monitor.audit_log.create') }, |
||||
{ value: 'UPDATE', label: t('monitor.audit_log.update') }, |
||||
{ value: 'DELETE', label: t('monitor.audit_log.delete') }, |
||||
{ value: 'READ', label: t('monitor.audit_log.read') } |
||||
]} |
||||
placeholder={t('monitor.audit_log.operation_type')} |
||||
style={{ width: '180px' }} |
||||
clearable |
||||
/> |
||||
<NSelect |
||||
v-model={[this.resourceType, 'value']} |
||||
size='small' |
||||
options={[ |
||||
{ |
||||
value: 'USER_MODULE', |
||||
label: t('monitor.audit_log.user_audit') |
||||
}, |
||||
{ |
||||
value: 'PROJECT_MODULE', |
||||
label: t('monitor.audit_log.project_audit') |
||||
} |
||||
]} |
||||
placeholder={t('monitor.audit_log.resource_type')} |
||||
style={{ width: '180px' }} |
||||
clearable |
||||
/> |
||||
<NDatePicker |
||||
v-model={[this.datePickerRange, 'value']} |
||||
type='datetimerange' |
||||
size='small' |
||||
start-placeholder={t('monitor.audit_log.start_time')} |
||||
end-placeholder={t('monitor.audit_log.end_time')} |
||||
clearable |
||||
/> |
||||
<NButton size='small' type='primary' onClick={onSearch}> |
||||
{{ |
||||
icon: () => ( |
||||
<NIcon> |
||||
<SearchOutlined /> |
||||
</NIcon> |
||||
) |
||||
}} |
||||
</NButton> |
||||
</NSpace> |
||||
</NCard> |
||||
<Card class={styles['table-card']}> |
||||
<NDataTable columns={this.columns} data={this.tableData} /> |
||||
<div class={styles.pagination}> |
||||
<NPagination |
||||
v-model:page={this.page} |
||||
v-model:page-size={this.pageSize} |
||||
page-count={this.totalPage} |
||||
show-size-picker |
||||
page-sizes={[10, 30, 50]} |
||||
show-quick-jumper |
||||
onUpdatePage={requestTableData} |
||||
onUpdatePageSize={onUpdatePageSize} |
||||
/> |
||||
</div> |
||||
</Card> |
||||
</> |
||||
) |
||||
} |
||||
}) |
||||
|
||||
export default AuditLog |
||||
@ -0,0 +1,105 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { useI18n } from 'vue-i18n' |
||||
import { reactive, ref } from 'vue' |
||||
import { useAsyncState } from '@vueuse/core' |
||||
import { queryAuditLogListPaging } from '@/service/modules/audit' |
||||
import { format } from 'date-fns' |
||||
import type { AuditListRes } from '@/service/modules/audit/types' |
||||
|
||||
export function useTable() { |
||||
const { t } = useI18n() |
||||
|
||||
const variables = reactive({ |
||||
columns: [], |
||||
tableData: [], |
||||
page: ref(1), |
||||
pageSize: ref(10), |
||||
resourceType: ref(null), |
||||
operationType: ref(null), |
||||
userName: ref(null), |
||||
datePickerRange: ref(null), |
||||
totalPage: ref(1) |
||||
}) |
||||
|
||||
const createColumns = (variables: any) => { |
||||
variables.columns = [ |
||||
{ |
||||
title: '#', |
||||
key: 'index' |
||||
}, |
||||
{ |
||||
title: t('monitor.audit_log.user_name'), |
||||
key: 'userName' |
||||
}, |
||||
{ |
||||
title: t('monitor.audit_log.resource_type'), |
||||
key: 'resource' |
||||
}, |
||||
{ |
||||
title: t('monitor.audit_log.project_name'), |
||||
key: 'resourceName' |
||||
}, |
||||
{ |
||||
title: t('monitor.audit_log.operation_type'), |
||||
key: 'operation' |
||||
}, |
||||
{ |
||||
title: t('monitor.audit_log.create_time'), |
||||
key: 'time' |
||||
} |
||||
] |
||||
} |
||||
|
||||
const getTableData = (params: any) => { |
||||
const data = { |
||||
pageSize: params.pageSize, |
||||
pageNo: params.pageNo, |
||||
resourceType: params.resourceType, |
||||
operationType: params.operationType, |
||||
userName: params.userName, |
||||
startDate: params.datePickerRange |
||||
? format(new Date(params.datePickerRange[0]), 'yyyy-MM-dd HH:mm:ss') |
||||
: '', |
||||
endDate: params.datePickerRange |
||||
? format(new Date(params.datePickerRange[1]), 'yyyy-MM-dd HH:mm:ss') |
||||
: '' |
||||
} |
||||
|
||||
const { state } = useAsyncState( |
||||
queryAuditLogListPaging(data).then((res: AuditListRes) => { |
||||
variables.tableData = res.totalList.map((item, index) => { |
||||
return { |
||||
index: index + 1, |
||||
...item |
||||
} |
||||
}) as any |
||||
}), |
||||
{} |
||||
) |
||||
|
||||
return state |
||||
} |
||||
|
||||
return { |
||||
t, |
||||
variables, |
||||
getTableData, |
||||
createColumns |
||||
} |
||||
} |
||||
Loading…
Reference in new issue