mirror of
https://github.com/0xJacky/nginx-ui.git
synced 2025-05-11 18:35:51 +02:00
fix: bug fix
This commit is contained in:
parent
a19878aaeb
commit
5e89860068
6 changed files with 71 additions and 46 deletions
|
@ -51,6 +51,10 @@ const props = defineProps({
|
||||||
exportCsv: {
|
exportCsv: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
|
},
|
||||||
|
modalWidth: {
|
||||||
|
type: Number,
|
||||||
|
default: 600
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -131,13 +135,13 @@ function edit(id: any) {
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<std-table
|
<std-table
|
||||||
ref="table"
|
ref="table"
|
||||||
v-bind="props"
|
v-bind="props"
|
||||||
@clickEdit="edit"
|
@clickEdit="edit"
|
||||||
@selected="onSelect"
|
@selected="onSelect"
|
||||||
:key="update"
|
:key="update"
|
||||||
:get_params="get_params"
|
:get_params="get_params"
|
||||||
:exportCsv="exportCsv"
|
:exportCsv="exportCsv"
|
||||||
>
|
>
|
||||||
<template v-slot:actions="slotProps">
|
<template v-slot:actions="slotProps">
|
||||||
<slot name="actions" :actions="slotProps.record"/>
|
<slot name="actions" :actions="slotProps.record"/>
|
||||||
|
@ -146,22 +150,22 @@ function edit(id: any) {
|
||||||
</a-card>
|
</a-card>
|
||||||
|
|
||||||
<a-modal
|
<a-modal
|
||||||
class="std-curd-edit-modal"
|
class="std-curd-edit-modal"
|
||||||
:mask="false"
|
:mask="false"
|
||||||
:title="data.id ? $gettext('Modify') : $gettext('Add')"
|
:title="data.id ? $gettext('Modify') : $gettext('Add')"
|
||||||
:visible="visible"
|
:visible="visible"
|
||||||
:cancel-text="$gettext('Cancel')"
|
:cancel-text="$gettext('Cancel')"
|
||||||
:ok-text="$gettext('OK')"
|
:ok-text="$gettext('OK')"
|
||||||
@cancel="cancel"
|
@cancel="cancel"
|
||||||
@ok="ok"
|
@ok="ok"
|
||||||
:width="600"
|
:width="modalWidth"
|
||||||
destroyOnClose
|
destroyOnClose
|
||||||
>
|
>
|
||||||
<std-data-entry
|
<std-data-entry
|
||||||
ref="std_data_entry"
|
ref="std_data_entry"
|
||||||
:data-list="editableColumns()"
|
:data-list="editableColumns()"
|
||||||
v-model:data-source="data"
|
v-model:data-source="data"
|
||||||
:error="error"
|
:error="error"
|
||||||
/>
|
/>
|
||||||
<slot name="edit" :data="data"/>
|
<slot name="edit" :data="data"/>
|
||||||
</a-modal>
|
</a-modal>
|
||||||
|
|
|
@ -11,13 +11,12 @@ function changePage(num: number) {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div v-if="pagination.total>pagination.per_page">
|
<div class="pagination-container" v-if="pagination.total>pagination.per_page">
|
||||||
<a-pagination
|
<a-pagination
|
||||||
:current="pagination.current_page"
|
:current="pagination.current_page"
|
||||||
:pageSize="pagination.per_page"
|
:pageSize="pagination.per_page"
|
||||||
:size="size"
|
:size="size"
|
||||||
:total="pagination.total"
|
:total="pagination.total"
|
||||||
class="pagination"
|
|
||||||
@change="changePage"
|
@change="changePage"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
@ -32,12 +31,12 @@ function changePage(num: number) {
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.pagination {
|
.pagination-container {
|
||||||
padding: 10px 0 0 0;
|
padding: 10px 0 0 0;
|
||||||
float: right;
|
display: flex;
|
||||||
|
justify-content: right;
|
||||||
@media (max-width: 450px) {
|
@media (max-width: 450px) {
|
||||||
float: unset;
|
justify-content: center;
|
||||||
text-align: center;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -6,10 +6,11 @@ import {computed, onMounted, reactive, ref, watch} from 'vue'
|
||||||
import {useRoute, useRouter} from 'vue-router'
|
import {useRoute, useRouter} from 'vue-router'
|
||||||
import {message} from 'ant-design-vue'
|
import {message} from 'ant-design-vue'
|
||||||
import {downloadCsv} from '@/lib/helper'
|
import {downloadCsv} from '@/lib/helper'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
|
||||||
const {$gettext, interpolate} = gettext
|
const {$gettext, interpolate} = gettext
|
||||||
|
|
||||||
const emit = defineEmits(['onSelected', 'onSelectedRecord', 'clickEdit'])
|
const emit = defineEmits(['onSelected', 'onSelectedRecord', 'clickEdit', 'update:selectedRowKeys'])
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
api: Object,
|
api: Object,
|
||||||
|
@ -66,6 +67,11 @@ const props = defineProps({
|
||||||
exportCsv: {
|
exportCsv: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
|
},
|
||||||
|
size: String,
|
||||||
|
selectedRowKeys: {
|
||||||
|
type: Array,
|
||||||
|
default: []
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -83,7 +89,14 @@ const params = reactive({
|
||||||
...props.get_params
|
...props.get_params
|
||||||
})
|
})
|
||||||
|
|
||||||
const selectedRowKeys = ref([])
|
const selectedRowKeysBuffer = computed({
|
||||||
|
get() {
|
||||||
|
return props?.selectedRowKeys ?? []
|
||||||
|
},
|
||||||
|
set(v) {
|
||||||
|
emit('update:selectedRowKeys', v)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
const searchColumns = getSearchColumns()
|
const searchColumns = getSearchColumns()
|
||||||
const pithyColumns = getPithyColumns()
|
const pithyColumns = getPithyColumns()
|
||||||
|
@ -170,8 +183,13 @@ function checked(c: any) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function onSelectChange(_selectedRowKeys: any) {
|
function onSelectChange(_selectedRowKeys: any) {
|
||||||
selectedRowKeys.value = _selectedRowKeys
|
const n: any = [..._selectedRowKeys]
|
||||||
emit('onSelected', selectedRowKeys.value)
|
const t = [...selectedRowKeysBuffer.value].concat(n)
|
||||||
|
|
||||||
|
const set = new Set(t)
|
||||||
|
selectedRowKeysBuffer.value = Array.from(set)
|
||||||
|
|
||||||
|
emit('onSelected', selectedRowKeysBuffer.value)
|
||||||
}
|
}
|
||||||
|
|
||||||
function onSelect(record: any) {
|
function onSelect(record: any) {
|
||||||
|
@ -201,7 +219,7 @@ watch(params, () => {
|
||||||
const rowSelection = computed(() => {
|
const rowSelection = computed(() => {
|
||||||
if (props.selectionType) {
|
if (props.selectionType) {
|
||||||
return {
|
return {
|
||||||
selectedRowKeys: selectedRowKeys, onChange: onSelectChange,
|
selectedRowKeys: selectedRowKeysBuffer, onChange: onSelectChange,
|
||||||
onSelect: onSelect, type: props.selectionType
|
onSelect: onSelect, type: props.selectionType
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
|
@ -263,7 +281,9 @@ async function export_csv() {
|
||||||
dataSource = dataSource.concat(...response[props.data_key])
|
dataSource = dataSource.concat(...response[props.data_key])
|
||||||
}
|
}
|
||||||
}).catch((e: any) => {
|
}).catch((e: any) => {
|
||||||
message.error(e.message ?? '系统错误')
|
message.error(e.message ?? $gettext('Server error'))
|
||||||
|
hasMore = false
|
||||||
|
return
|
||||||
})
|
})
|
||||||
page += 1
|
page += 1
|
||||||
}
|
}
|
||||||
|
@ -271,17 +291,16 @@ async function export_csv() {
|
||||||
dataSource.forEach((row: Object) => {
|
dataSource.forEach((row: Object) => {
|
||||||
let obj: any = {}
|
let obj: any = {}
|
||||||
headerKeys.forEach(key => {
|
headerKeys.forEach(key => {
|
||||||
console.log(row, key)
|
|
||||||
let data = fn(row, key)
|
let data = fn(row, key)
|
||||||
const c = showColumnsMap[key]
|
const c = showColumnsMap[key]
|
||||||
console.log(c)
|
|
||||||
data = c?.customRender?.({text: data}) ?? data
|
data = c?.customRender?.({text: data}) ?? data
|
||||||
obj[c.dataIndex] = data
|
obj[c.dataIndex] = data
|
||||||
})
|
})
|
||||||
data.push(obj)
|
data.push(obj)
|
||||||
})
|
})
|
||||||
console.log(header, data)
|
|
||||||
downloadCsv(header, data, '测试.csv')
|
downloadCsv(header, data,
|
||||||
|
`${$gettext('Export')}-${dayjs().format('YYYYMMDDHHmmss')}.csv`)
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -295,11 +314,11 @@ async function export_csv() {
|
||||||
>
|
>
|
||||||
<template #action>
|
<template #action>
|
||||||
<a-space class="reset-btn">
|
<a-space class="reset-btn">
|
||||||
<a-button @click="export_csv" type="primary" ghost>
|
<a-button v-if="exportCsv" @click="export_csv" type="primary" ghost>
|
||||||
<translate>Export</translate>
|
{{ $gettext('Export') }}
|
||||||
</a-button>
|
</a-button>
|
||||||
<a-button @click="reset_search">
|
<a-button @click="reset_search">
|
||||||
<translate>Reset</translate>
|
{{ $gettext('Reset') }}
|
||||||
</a-button>
|
</a-button>
|
||||||
</a-space>
|
</a-space>
|
||||||
</template>
|
</template>
|
||||||
|
@ -313,6 +332,7 @@ async function export_csv() {
|
||||||
:rowSelection="rowSelection"
|
:rowSelection="rowSelection"
|
||||||
@change="stdChange"
|
@change="stdChange"
|
||||||
:scroll="{ x: scrollX }"
|
:scroll="{ x: scrollX }"
|
||||||
|
:size="size"
|
||||||
>
|
>
|
||||||
<template
|
<template
|
||||||
v-slot:bodyCell="{text, record, index, column}"
|
v-slot:bodyCell="{text, record, index, column}"
|
||||||
|
@ -335,7 +355,7 @@ async function export_csv() {
|
||||||
</template>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
</a-table>
|
</a-table>
|
||||||
<std-pagination :pagination="pagination" @changePage="get_list"/>
|
<std-pagination :size="size" :pagination="pagination" @changePage="get_list"/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,9 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import {onMounted, reactive, ref, watch} from 'vue'
|
import {onMounted, reactive, ref, watch} from 'vue'
|
||||||
import StdTable from '@/components/StdDataDisplay/StdTable.vue'
|
import StdTable from '@/components/StdDataDisplay/StdTable.vue'
|
||||||
|
import gettext from '@/gettext'
|
||||||
|
|
||||||
|
const {$gettext} = gettext
|
||||||
const props = defineProps(['selectedKey', 'value', 'recordValueIndex',
|
const props = defineProps(['selectedKey', 'value', 'recordValueIndex',
|
||||||
'selectionType', 'api', 'columns', 'data_key',
|
'selectionType', 'api', 'columns', 'data_key',
|
||||||
'disable_search', 'get_params', 'description'])
|
'disable_search', 'get_params', 'description'])
|
||||||
|
@ -70,9 +72,9 @@ watch(props, () => {
|
||||||
<a-modal
|
<a-modal
|
||||||
:mask="false"
|
:mask="false"
|
||||||
:visible="visible"
|
:visible="visible"
|
||||||
cancel-text="取消"
|
:cancel-text="$gettext('Cancel')"
|
||||||
ok-text="选择"
|
:ok-text="$gettext('Ok')"
|
||||||
title="选择器"
|
:title="$gettext('Selector')"
|
||||||
@cancel="visible=false"
|
@cancel="visible=false"
|
||||||
@ok="ok()"
|
@ok="ok()"
|
||||||
:width="800"
|
:width="800"
|
||||||
|
|
|
@ -1 +1 @@
|
||||||
{"version":"1.6.0","build_id":47,"total_build":117}
|
{"version":"1.6.0","build_id":49,"total_build":119}
|
|
@ -1 +1 @@
|
||||||
{"version":"1.6.0","build_id":47,"total_build":117}
|
{"version":"1.6.0","build_id":49,"total_build":119}
|
Loading…
Add table
Add a link
Reference in a new issue