重构: 登录日志前端完成
李强
parent
005cb242c8
commit
4a3aaba0b5
|
|
@ -0,0 +1,19 @@
|
|||
/*
|
||||
* @创建文件时间: 2021-06-08 10:40:32
|
||||
* @Auther: 猿小天
|
||||
* @最后修改人: 猿小天
|
||||
* @最后修改时间: 2021-06-09 10:36:20
|
||||
* 联系Qq:1638245306
|
||||
* @文件介绍: 操作日志
|
||||
*/
|
||||
import { request } from '@/api/service'
|
||||
|
||||
export const urlPrefix = '/api/system/login_log/'
|
||||
|
||||
export function GetList (query) {
|
||||
return request({
|
||||
url: urlPrefix,
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,293 @@
|
|||
import { BUTTON_WHETHER_BOOL } from '@/config/button'
|
||||
|
||||
export const crudOptions = (vm) => {
|
||||
return {
|
||||
pageOptions: {
|
||||
compact: true
|
||||
},
|
||||
options: {
|
||||
tableType: 'vxe-table',
|
||||
rowKey: true, // 必须设置，true or false
|
||||
rowId: 'id',
|
||||
height: '100%', // 表格高度100%, 使用toolbar必须设置
|
||||
highlightCurrentRow: false
|
||||
|
||||
},
|
||||
rowHandle: {
|
||||
fixed: 'right',
|
||||
view: {
|
||||
thin: true,
|
||||
text: '',
|
||||
disabled () {
|
||||
return !vm.hasPermissions('Retrieve')
|
||||
}
|
||||
},
|
||||
width: 70,
|
||||
edit: {
|
||||
thin: true,
|
||||
text: '',
|
||||
show: false,
|
||||
disabled () {
|
||||
return !vm.hasPermissions('Update')
|
||||
}
|
||||
},
|
||||
remove: {
|
||||
thin: true,
|
||||
text: '删除',
|
||||
show: false,
|
||||
disabled () {
|
||||
return !vm.hasPermissions('Delete')
|
||||
}
|
||||
}
|
||||
},
|
||||
viewOptions: {
|
||||
componentType: 'form'
|
||||
},
|
||||
formOptions: {
|
||||
disabled: true,
|
||||
defaultSpan: 12 // 默认的表单 span
|
||||
},
|
||||
indexRow: { // 或者直接传true,不显示title，不居中
|
||||
title: '序号',
|
||||
align: 'center',
|
||||
width: 70
|
||||
},
|
||||
columns: [
|
||||
{
|
||||
title: '关键词',
|
||||
key: 'search',
|
||||
show: false,
|
||||
disabled: true,
|
||||
search: {
|
||||
disabled: false
|
||||
},
|
||||
form: {
|
||||
show: false,
|
||||
component: {
|
||||
placeholder: '请输入关键词'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: 'ID',
|
||||
key: 'id',
|
||||
width: 90,
|
||||
disabled: true,
|
||||
form: {
|
||||
disabled: true
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '登录用户名',
|
||||
key: 'username',
|
||||
search: {
|
||||
disabled: false
|
||||
},
|
||||
width: 140,
|
||||
type: 'input',
|
||||
form: {
|
||||
disabled: true,
|
||||
component: {
|
||||
placeholder: '请输入登录用户名'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '登录ip',
|
||||
key: 'ip',
|
||||
search: {
|
||||
disabled: false
|
||||
},
|
||||
width: 130,
|
||||
type: 'input',
|
||||
form: {
|
||||
disabled: true,
|
||||
component: {
|
||||
placeholder: '请输入登录ip'
|
||||
}
|
||||
}
|
||||
}, {
|
||||
title: '运营商',
|
||||
key: 'isp',
|
||||
search: {
|
||||
disabled: true
|
||||
},
|
||||
disabled: true,
|
||||
width: 180,
|
||||
type: 'input',
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入操作系统'
|
||||
}
|
||||
}
|
||||
}, {
|
||||
title: '大州',
|
||||
key: 'continent',
|
||||
width: 80,
|
||||
type: 'input',
|
||||
form: {
|
||||
disabled: true,
|
||||
component: {
|
||||
placeholder: '请输入州'
|
||||
}
|
||||
},
|
||||
component: { props: { color: 'auto' } } // 自动染色
|
||||
}, {
|
||||
title: '国家',
|
||||
key: 'country',
|
||||
width: 80,
|
||||
type: 'input',
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入国家'
|
||||
}
|
||||
},
|
||||
component: { props: { color: 'auto' } } // 自动染色
|
||||
}, {
|
||||
title: '省份',
|
||||
key: 'province',
|
||||
width: 80,
|
||||
type: 'input',
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入省份'
|
||||
}
|
||||
},
|
||||
component: { props: { color: 'auto' } } // 自动染色
|
||||
}, {
|
||||
title: '城市',
|
||||
key: 'city',
|
||||
width: 80,
|
||||
type: 'input',
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入城市'
|
||||
}
|
||||
},
|
||||
component: { props: { color: 'auto' } } // 自动染色
|
||||
}, {
|
||||
title: '县区',
|
||||
key: 'district',
|
||||
width: 80,
|
||||
type: 'input',
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入县区'
|
||||
}
|
||||
},
|
||||
component: { props: { color: 'auto' } } // 自动染色
|
||||
}, {
|
||||
title: '区域代码',
|
||||
key: 'area_code',
|
||||
width: 100,
|
||||
type: 'input',
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入区域代码'
|
||||
}
|
||||
},
|
||||
component: { props: { color: 'auto' } } // 自动染色
|
||||
}, {
|
||||
title: '英文全称',
|
||||
key: 'country_english',
|
||||
width: 120,
|
||||
type: 'input',
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入英文全称'
|
||||
}
|
||||
},
|
||||
component: { props: { color: 'auto' } } // 自动染色
|
||||
}, {
|
||||
title: '简称',
|
||||
key: 'country_code',
|
||||
width: 100,
|
||||
type: 'input',
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入简称'
|
||||
}
|
||||
},
|
||||
component: { props: { color: 'auto' } } // 自动染色
|
||||
}, {
|
||||
title: '经度',
|
||||
key: 'longitude',
|
||||
width: 80,
|
||||
type: 'input',
|
||||
disabled: true,
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入经度'
|
||||
}
|
||||
},
|
||||
component: { props: { color: 'auto' } } // 自动染色
|
||||
}, {
|
||||
title: '纬度',
|
||||
key: 'latitude',
|
||||
width: 80,
|
||||
type: 'input',
|
||||
disabled: true,
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入纬度'
|
||||
}
|
||||
},
|
||||
component: { props: { color: 'auto' } } // 自动染色
|
||||
}, {
|
||||
title: '登录类型',
|
||||
key: 'login_type',
|
||||
width: 100,
|
||||
type: 'select',
|
||||
search: {
|
||||
disabled: false
|
||||
},
|
||||
dict: {
|
||||
data: [{ label: '普通登录', value: 1 }]
|
||||
},
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请选择登录类型'
|
||||
}
|
||||
},
|
||||
component: { props: { color: 'auto' } } // 自动染色
|
||||
}, {
|
||||
title: '操作系统',
|
||||
key: 'os',
|
||||
width: 180,
|
||||
type: 'input',
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入操作系统'
|
||||
}
|
||||
}
|
||||
}, {
|
||||
title: '浏览器名',
|
||||
key: 'browser',
|
||||
width: 180,
|
||||
type: 'input',
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入操作系统'
|
||||
}
|
||||
}
|
||||
}, {
|
||||
title: 'agent信息',
|
||||
key: 'agent',
|
||||
disabled: true,
|
||||
width: 180,
|
||||
type: 'input',
|
||||
form: {
|
||||
component: {
|
||||
placeholder: '请输入操作系统'
|
||||
}
|
||||
}
|
||||
}, {
|
||||
fixed: 'right',
|
||||
title: '登录时间',
|
||||
key: 'create_datetime',
|
||||
width: 160,
|
||||
type: 'datetime'
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
<template>
|
||||
<d2-container :class="{ 'page-compact': crud.pageOptions.compact }">
|
||||
<d2-crud-x
|
||||
ref="d2Crud"
|
||||
v-bind="_crudProps"
|
||||
v-on="_crudListeners"
|
||||
crud.options.tableType="vxe-table"
|
||||
>
|
||||
<div slot="header">
|
||||
<crud-search
|
||||
ref="search"
|
||||
:options="crud.searchOptions"
|
||||
@submit="handleSearch"
|
||||
/>
|
||||
<crud-toolbar
|
||||
:search.sync="crud.searchOptions.show"
|
||||
:compact.sync="crud.pageOptions.compact"
|
||||
:columns="crud.columns"
|
||||
@refresh="doRefresh()"
|
||||
@columns-filter-changed="handleColumnsFilterChanged"
|
||||
/>
|
||||
</div>
|
||||
</d2-crud-x>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as api from './api'
|
||||
import { crudOptions } from './crud'
|
||||
import { d2CrudPlus } from 'd2-crud-plus'
|
||||
|
||||
export default {
|
||||
name: 'operationLog',
|
||||
|
||||
mixins: [d2CrudPlus.crud],
|
||||
data () {
|
||||
return {}
|
||||
},
|
||||
methods: {
|
||||
getCrudOptions () {
|
||||
return crudOptions(this)
|
||||
},
|
||||
pageRequest (query) {
|
||||
return api.GetList(query)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Loading…
Reference in New Issue