Merge branch 'master-dev' into feature-Beta-dev-renpy
This commit is contained in:
commit
1a53bec41b
|
@ -2,6 +2,7 @@
|
||||||
<a-table
|
<a-table
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
class="custom-table"
|
class="custom-table"
|
||||||
|
:class="['custom-table', canSelect && multiple && mouseMoveSelect ? 'mouse-move-select' : '']"
|
||||||
v-bind="$attrs"
|
v-bind="$attrs"
|
||||||
:data-source="list"
|
:data-source="list"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
|
@ -9,7 +10,7 @@
|
||||||
:row-key="rowKey"
|
:row-key="rowKey"
|
||||||
:loading="loading"
|
:loading="loading"
|
||||||
:pagination="pagination"
|
:pagination="pagination"
|
||||||
:customRow="customRow"
|
:customRow="multiple && mouseMoveSelect ? customMouseMoveSelectRow : customRow"
|
||||||
:rowClassName="() => (canSelect ? 'custom-table-row' : '')"
|
:rowClassName="() => (canSelect ? 'custom-table-row' : '')"
|
||||||
@change="handleTableChange"
|
@change="handleTableChange"
|
||||||
>
|
>
|
||||||
|
@ -58,10 +59,16 @@ export default {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true,
|
default: true,
|
||||||
},
|
},
|
||||||
|
// 多选
|
||||||
multiple: {
|
multiple: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false,
|
||||||
},
|
},
|
||||||
|
// 鼠标移动选择
|
||||||
|
mouseMoveSelect: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true,
|
||||||
|
},
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
@ -69,6 +76,14 @@ export default {
|
||||||
innerSelectedRows: [],
|
innerSelectedRows: [],
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
mounted() {
|
||||||
|
if (this.canSelect && this.multiple && this.mouseMoveSelect) {
|
||||||
|
const tbody = this.$el.querySelector('.ant-table-tbody')
|
||||||
|
tbody.addEventListener('mouseleave', () => {
|
||||||
|
this.mouseMoveStartIndex = undefined
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 实现单击选中/反选功能
|
// 实现单击选中/反选功能
|
||||||
customRow(record, index) {
|
customRow(record, index) {
|
||||||
|
@ -105,6 +120,34 @@ export default {
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// 实现鼠标拖移动多选功能
|
||||||
|
customMouseMoveSelectRow(record, index) {
|
||||||
|
const key = record[this.rowKey]
|
||||||
|
return {
|
||||||
|
class: this.innerSelectedRowKeys.includes(key) ? 'ant-table-row-selected' : '',
|
||||||
|
on: {
|
||||||
|
mousedown: () => {
|
||||||
|
this.innerSelectedRowKeys = []
|
||||||
|
this.mouseMoveStartIndex = index
|
||||||
|
},
|
||||||
|
mouseenter: () => {
|
||||||
|
if (this.mouseMoveStartIndex !== undefined) {
|
||||||
|
const indexes = [this.mouseMoveStartIndex, index].sort((a, b) => a - b)
|
||||||
|
this.innerSelectedRowKeys = this.list.slice(indexes[0], indexes[1] + 1).map((item) => item[this.rowKey])
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mouseup: () => {
|
||||||
|
// 开始和结束在同一个,相当于click
|
||||||
|
if (this.mouseMoveStartIndex == index) {
|
||||||
|
this.innerSelectedRowKeys = [key]
|
||||||
|
}
|
||||||
|
this.mouseMoveStartIndex = undefined
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
handleTableChange(pagination, filters, sorter) {
|
handleTableChange(pagination, filters, sorter) {
|
||||||
this.$emit('change', pagination, filters, sorter)
|
this.$emit('change', pagination, filters, sorter)
|
||||||
},
|
},
|
||||||
|
@ -136,8 +179,20 @@ export default {
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang="less">
|
<style lang="less" scoped>
|
||||||
.custom-table-row {
|
::v-deep {
|
||||||
cursor: pointer;
|
.custom-table-row {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mouse-move-select {
|
||||||
|
user-select: none;
|
||||||
|
|
||||||
|
::v-deep {
|
||||||
|
td {
|
||||||
|
transition: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -13,6 +13,7 @@
|
||||||
:list="dataSource"
|
:list="dataSource"
|
||||||
:loading="loading"
|
:loading="loading"
|
||||||
:canSelect="false"
|
:canSelect="false"
|
||||||
|
:scroll="{ y: 390 }"
|
||||||
>
|
>
|
||||||
<template slot="info" slot-scope="{ record }">
|
<template slot="info" slot-scope="{ record }">
|
||||||
<a-popover>
|
<a-popover>
|
||||||
|
|
|
@ -10,6 +10,7 @@
|
||||||
:list="dataSource"
|
:list="dataSource"
|
||||||
:loading="loading"
|
:loading="loading"
|
||||||
:pagination="false"
|
:pagination="false"
|
||||||
|
:scroll="{ y: 655 }"
|
||||||
@rowDbclick="rowClick"
|
@rowDbclick="rowClick"
|
||||||
>
|
>
|
||||||
<!-- <template slot="stationList" slot-scope="{ text }">
|
<!-- <template slot="stationList" slot-scope="{ text }">
|
||||||
|
|
|
@ -53,6 +53,7 @@
|
||||||
:loading="loading"
|
:loading="loading"
|
||||||
:pagination="false"
|
:pagination="false"
|
||||||
:canSelect="false"
|
:canSelect="false"
|
||||||
|
:scroll="{ y: 655 }"
|
||||||
>
|
>
|
||||||
</TableList>
|
</TableList>
|
||||||
<a-pagination
|
<a-pagination
|
||||||
|
|
|
@ -30,6 +30,21 @@
|
||||||
</a-card>
|
</a-card>
|
||||||
<!-- 日志列表 -->
|
<!-- 日志列表 -->
|
||||||
<div class="log-list">
|
<div class="log-list">
|
||||||
|
<div class="search-bar">
|
||||||
|
<a-row type="flex">
|
||||||
|
<a-col flex="290px">
|
||||||
|
<a-form-model-item label="Name">
|
||||||
|
<a-input v-model="nameStr" placeholder="Please Input..." />
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col flex="108px">
|
||||||
|
<a-button class="search-btn" type="primary" @click="onSearch">
|
||||||
|
<img src="@/assets/images/global/search.png" alt="" />
|
||||||
|
Search
|
||||||
|
</a-button>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</div>
|
||||||
<custom-table
|
<custom-table
|
||||||
size="middle"
|
size="middle"
|
||||||
rowKey="id"
|
rowKey="id"
|
||||||
|
@ -39,7 +54,7 @@
|
||||||
:loading="isGettingTreeData || loading"
|
:loading="isGettingTreeData || loading"
|
||||||
:can-select="false"
|
:can-select="false"
|
||||||
@change="handleTableChange"
|
@change="handleTableChange"
|
||||||
:scroll="{ y: 'calc(100vh - 175px)' }"
|
:scroll="{ y: 'calc(100vh - 275px)' }"
|
||||||
>
|
>
|
||||||
<template slot="operate" slot-scope="{ record }">
|
<template slot="operate" slot-scope="{ record }">
|
||||||
<a-space :size="20">
|
<a-space :size="20">
|
||||||
|
@ -53,6 +68,22 @@
|
||||||
</a-space>
|
</a-space>
|
||||||
</template>
|
</template>
|
||||||
</custom-table>
|
</custom-table>
|
||||||
|
<a-pagination
|
||||||
|
size="small"
|
||||||
|
v-model="ipagination.current"
|
||||||
|
:pageSize="ipagination.pageSize"
|
||||||
|
:page-size-options="ipagination.pageSizeOptions"
|
||||||
|
show-size-changer
|
||||||
|
show-quick-jumper
|
||||||
|
:total="ipagination.total"
|
||||||
|
:show-total="
|
||||||
|
(total, range) =>
|
||||||
|
`Total ${total} items Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`
|
||||||
|
"
|
||||||
|
show-less-items
|
||||||
|
@change="handlePageChange"
|
||||||
|
@showSizeChange="handleSizeChange"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<!-- 日志列表结束 -->
|
<!-- 日志列表结束 -->
|
||||||
<custom-modal title="Log" :width="950" v-model="visible" :footer="null">
|
<custom-modal title="Log" :width="950" v-model="visible" :footer="null">
|
||||||
|
@ -108,6 +139,7 @@ export default {
|
||||||
data() {
|
data() {
|
||||||
this.columns = columns
|
this.columns = columns
|
||||||
return {
|
return {
|
||||||
|
nameStr: '',
|
||||||
disableMixinCreated: true,
|
disableMixinCreated: true,
|
||||||
url: {
|
url: {
|
||||||
list: '/logManage/findFiles',
|
list: '/logManage/findFiles',
|
||||||
|
@ -121,12 +153,37 @@ export default {
|
||||||
visible: false,
|
visible: false,
|
||||||
isGettingDetail: false,
|
isGettingDetail: false,
|
||||||
logInfo: [],
|
logInfo: [],
|
||||||
|
ipagination: {
|
||||||
|
current: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
pageSizeOptions: ['10', '20', '30'],
|
||||||
|
showTotal: (total, range) => {
|
||||||
|
const { current, pageSize } = this.ipagination
|
||||||
|
return `Total ${total} items Page ${current} / ${Math.ceil(total / pageSize)}`
|
||||||
|
},
|
||||||
|
showQuickJumper: true,
|
||||||
|
showSizeChanger: true,
|
||||||
|
total: 0,
|
||||||
|
},
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.getTreeData()
|
this.getTreeData()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
onSearch() {
|
||||||
|
this.loadData()
|
||||||
|
},
|
||||||
|
handlePageChange(page, pageSize) {
|
||||||
|
this.ipagination.current = page
|
||||||
|
this.ipagination.pageSize = pageSize
|
||||||
|
this.loadData()
|
||||||
|
},
|
||||||
|
handleSizeChange(current, size) {
|
||||||
|
this.ipagination.current = current
|
||||||
|
this.ipagination.pageSize = size
|
||||||
|
this.loadData()
|
||||||
|
},
|
||||||
async getTreeData() {
|
async getTreeData() {
|
||||||
try {
|
try {
|
||||||
this.isGettingTreeData = true
|
this.isGettingTreeData = true
|
||||||
|
@ -164,6 +221,8 @@ export default {
|
||||||
},
|
},
|
||||||
onSelect() {
|
onSelect() {
|
||||||
this.queryParam.path = this.selectedKeys[0]
|
this.queryParam.path = this.selectedKeys[0]
|
||||||
|
this.ipagination.current = 1
|
||||||
|
this.ipagination.pageSize = 10
|
||||||
this.loadData()
|
this.loadData()
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -179,10 +238,14 @@ export default {
|
||||||
this.onClearSelected()
|
this.onClearSelected()
|
||||||
|
|
||||||
var params = this.getQueryParams() //查询条件
|
var params = this.getQueryParams() //查询条件
|
||||||
|
params.name = this.nameStr
|
||||||
|
params.pageNo = this.ipagination.current
|
||||||
|
params.pageSize = this.ipagination.pageSize
|
||||||
this.loading = true
|
this.loading = true
|
||||||
getAction(this.url.list, params)
|
getAction(this.url.list, params)
|
||||||
.then((res) => {
|
.then(({ result: { records, total } }) => {
|
||||||
this.dataSource = res
|
this.dataSource = records
|
||||||
|
this.ipagination.total = total
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
this.loading = false
|
this.loading = false
|
||||||
|
@ -302,6 +365,10 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
&-list {
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.log-detail {
|
.log-detail {
|
||||||
|
@ -314,4 +381,59 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.search-bar {
|
||||||
|
height: 50px;
|
||||||
|
border-top: 1px solid rgba(13, 235, 201, 0.3);
|
||||||
|
border-bottom: 1px solid rgba(13, 235, 201, 0.3);
|
||||||
|
margin-bottom: 15px;
|
||||||
|
padding: 8px 10px;
|
||||||
|
background: rgba(12, 235, 201, 0.05);
|
||||||
|
}
|
||||||
|
.ant-input {
|
||||||
|
width: 266px;
|
||||||
|
}
|
||||||
|
::v-deep {
|
||||||
|
.ant-form-item {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 0;
|
||||||
|
.ant-form-item-label,
|
||||||
|
.ant-form-item-control {
|
||||||
|
line-height: 32px;
|
||||||
|
height: 32px;
|
||||||
|
}
|
||||||
|
.ant-form-item-label {
|
||||||
|
flex-shrink: 0;
|
||||||
|
margin-right: 10px;
|
||||||
|
label {
|
||||||
|
font-size: 16px;
|
||||||
|
font-family: ArialMT;
|
||||||
|
color: #ade6ee;
|
||||||
|
&::after {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ant-calendar-range-picker-separator {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.ant-form-item-control-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
// overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.search-btn {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
img {
|
||||||
|
width: 16px;
|
||||||
|
height: 17px;
|
||||||
|
margin-right: 9px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ant-pagination {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
bottom: 0;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user