center/dataease-dm
center/dataease-dm
13
0
Fork 0
forked from github/dataease
Code Pull Requests Activity

refactor: 明细表优化

Browse Source
This commit is contained in:
junjun 2022-04-20 14:26:36 +08:00
parent e2764fb936
commit b4abe7f036
3 changed files with 19 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/views/chart/components/ChartComponentS2.vue
View File

@ -142,7 +142,7 @@ export default {
const attr = JSON.parse(this.chart.customAttr) const attr = JSON.parse(this.chart.customAttr)
this.currentPage.pageSize = parseInt(attr.size.tablePageSize ? attr.size.tablePageSize : 20) this.currentPage.pageSize = parseInt(attr.size.tablePageSize ? attr.size.tablePageSize : 20)
datas = JSON.parse(JSON.stringify(this.chart.data.tableRow)) datas = JSON.parse(JSON.stringify(this.chart.data.tableRow))
if (this.chart.type === 'table-info' && attr.size.tablePageMode === 'page' && datas.length > this.currentPage.pageSize) { if (this.chart.type === 'table-info' && (attr.size.tablePageMode === 'page' || !attr.size.tablePageMode) && datas.length > this.currentPage.pageSize) {
// 计算分页 // 计算分页
this.currentPage.show = datas.length this.currentPage.show = datas.length
const pageStart = (this.currentPage.page - 1) * this.currentPage.pageSize const pageStart = (this.currentPage.page - 1) * this.currentPage.pageSize

3
frontend/src/views/chart/components/shape-attr/SizeSelector.vue
View File

@ -116,6 +116,9 @@
<el-form-item :label="$t('chart.table_item_height')" class="form-item form-item-slider"> <el-form-item :label="$t('chart.table_item_height')" class="form-item form-item-slider">
<el-slider v-model="sizeForm.tableItemHeight" :min="36" :max="100" show-input :show-input-controls="false" input-size="mini" @change="changeBarSizeCase" /> <el-slider v-model="sizeForm.tableItemHeight" :min="36" :max="100" show-input :show-input-controls="false" input-size="mini" @change="changeBarSizeCase" />
</el-form-item> </el-form-item>
<el-form-item :label="$t('chart.table_column_width_config')" class="form-item form-item-slider">
<el-slider v-model="sizeForm.tableColumnWidth" :min="10" :max="1000" show-input :show-input-controls="false" input-size="mini" @change="changeBarSizeCase" />
</el-form-item>
</el-form> </el-form>
<el-form v-show="chart.type && chart.type.includes('gauge')" ref="sizeFormGauge" :model="sizeForm" label-width="100px" size="mini"> <el-form v-show="chart.type && chart.type.includes('gauge')" ref="sizeFormGauge" :model="sizeForm" label-width="100px" size="mini">

17
frontend/src/views/chart/components/table/TableNormal.vue
View File

@ -23,6 +23,7 @@
:resizable="true" :resizable="true"
sortable sortable
:title="field.name" :title="field.name"
:width="columnWidth"
> >
<!-- <template slot="header">--> <!-- <template slot="header">-->
<!-- <span>{{ field.name }}</span>--> <!-- <span>{{ field.name }}</span>-->
@ -56,6 +57,7 @@
<script> <script>
import { hexColorToRGBA } from '../../chart/util' import { hexColorToRGBA } from '../../chart/util'
import eventBus from '@/components/canvas/utils/eventBus' import eventBus from '@/components/canvas/utils/eventBus'
import { DEFAULT_SIZE } from '@/views/chart/chart/chart'
export default { export default {
name: 'TableNormal', name: 'TableNormal',
@ -168,8 +170,18 @@ export default {
this.fields = JSON.parse(JSON.stringify(this.chart.data.fields)) this.fields = JSON.parse(JSON.stringify(this.chart.data.fields))
const attr = JSON.parse(this.chart.customAttr) const attr = JSON.parse(this.chart.customAttr)
this.currentPage.pageSize = parseInt(attr.size.tablePageSize ? attr.size.tablePageSize : 20) this.currentPage.pageSize = parseInt(attr.size.tablePageSize ? attr.size.tablePageSize : 20)
// column width
const containerWidth = this.$refs.tableContainer.offsetWidth
const columnWidth = attr.size.tableColumnWidth ? attr.size.tableColumnWidth : this.columnWidth
if (columnWidth < (containerWidth / this.fields.length)) {
this.columnWidth = containerWidth / this.fields
} else {
this.columnWidth = columnWidth
}
datas = JSON.parse(JSON.stringify(this.chart.data.tableRow)) datas = JSON.parse(JSON.stringify(this.chart.data.tableRow))
if (this.chart.type === 'table-info' && attr.size.tablePageMode === 'page' && datas.length > this.currentPage.pageSize) { if (this.chart.type === 'table-info' && (attr.size.tablePageMode === 'page' || !attr.size.tablePageMode) && datas.length > this.currentPage.pageSize) {
// 计算分页 // 计算分页
this.currentPage.show = datas.length this.currentPage.show = datas.length
const pageStart = (this.currentPage.page - 1) * this.currentPage.pageSize const pageStart = (this.currentPage.page - 1) * this.currentPage.pageSize
@ -346,7 +358,8 @@ export default {
page: 1, page: 1,
pageSize: 20, pageSize: 20,
show: 0 show: 0
} },
columnWidth: DEFAULT_SIZE.tableColumnWidth
} }
} }
} }