test/go-view
1
0
Fork 0
mirror of https://gitee.com/dromara/go-view.git synced 2024-12-04 04:39:08 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: 修改滚动表格组件TS报错问题

Browse Source
This commit is contained in:
奔跑的面条 2022-06-14 12:14:44 +08:00
parent f9c17c732a
commit ffa127593a
5 changed files with 25 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/packages/components/Tables/Tables/TableScrollBoard/config.ts
View File

@ -2,7 +2,7 @@ import { publicConfig } from '@/packages/public'
import { CreateComponentType } from '@/packages/index.d'
import { TableScrollBoardConfig } from './index'
import cloneDeep from 'lodash/cloneDeep'
import dataJson from './data'
import dataJson from './data.json'
export const option = {
header: ['列1', '列2', '列3'],

1
src/packages/components/Tables/Tables/TableScrollBoard/config.vue
View File

@ -112,6 +112,7 @@ watch([header, align, columnWidth],([headerNew,alignNew,columnWidthNew],[headerO
props.optionData.align = alignNew.split(',')
}
if(columnWidthNew !== columnWidthOld){
// @ts-ignore
props.optionData.columnWidth = columnWidthNew.split(',')
}
})

12
src/packages/components/Tables/Tables/TableScrollBoard/data.js
View File

@ -1,12 +0,0 @@
export default [
['行1列1', '行1列2', '行1列3'],
['行2列1', '行2列2', '行2列3'],
['行3列1', '行3列2', '行3列3'],
['行4列1', '行4列2', '行4列3'],
['行5列1', '行5列2', '行5列3'],
['行6列1', '行6列2', '行6列3'],
['行7列1', '行7列2', '行7列3'],
['行8列1', '行8列2', '行8列3'],
['行9列1', '行9列2', '行9列3'],
['行10列1', '行10列2', '行10列3']
]

12
src/packages/components/Tables/Tables/TableScrollBoard/data.json Normal file
View File

@ -0,0 +1,12 @@
[
["行1列1", "行1列2", "行1列3"],
["行2列1", "行2列2", "行2列3"],
["行3列1", "行3列2", "行3列3"],
["行4列1", "行4列2", "行4列3"],
["行5列1", "行5列2", "行5列3"],
["行6列1", "行6列2", "行6列3"],
["行7列1", "行7列2", "行7列3"],
["行8列1", "行8列2", "行8列3"],
["行9列1", "行9列2", "行9列3"],
["行10列1", "行10列2", "行10列3"]
]

18
src/packages/components/Tables/Tables/TableScrollBoard/index.vue
View File

@ -25,7 +25,7 @@
</template>
<script setup lang="ts">
import { PropType, onUnmounted, reactive, toRefs, watch, onMounted, ref } from 'vue'
import { PropType, onUnmounted, reactive, toRefs, watch, onMounted } from 'vue'
import { CreateComponentType } from '@/packages/index.d'
import { useChartDataFetch } from '@/hooks'
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
@ -138,7 +138,11 @@ const status = reactive({
mergedConfig: props.chartConfig.option,
header: [],
rowsData: [],
rows: [],
rows: [{
ceils: [],
rowIndex: 0,
scroll: 0
}],
widths: [],
heights: [0],
avgHeight: 0,
@ -181,19 +185,19 @@ const calcHeaderData = () => {
const calcRowsData = () => {
let { dataset, index, headerBGC, rowNum } = status.mergedConfig
if (index) {
dataset = dataset.map((row, i) => {
dataset = dataset.map((row:any, i:number) => {
row = [...row]
const indexTag = `<span class="index" style="background-color: ${headerBGC};border-radius: 3px;padding: 0px 3px;">${i + 1}</span>`
row.unshift(indexTag)
return row
})
}
dataset = dataset.map((ceils, i) => ({ ceils, rowIndex: i }))
dataset = dataset.map((ceils:any, i:number) => ({ ceils, rowIndex: i }))
const rowLength = dataset.length
if (rowLength > rowNum && rowLength < 2 * rowNum) {
dataset = [...dataset, ...dataset]
}
dataset = dataset.map((d, i) => ({ ...d, scroll: i }))
dataset = dataset.map((d:any, i:number) => ({ ...d, scroll: i }))
status.rowsData = dataset
status.rows = dataset
@ -202,10 +206,10 @@ const calcRowsData = () => {
const calcWidths = () => {
const { mergedConfig, rowsData } = status
const { columnWidth, header } = mergedConfig
const usedWidth = columnWidth.reduce((all, ws) => all + ws, 0)
const usedWidth = columnWidth.reduce((all:any, ws:number) => all + ws, 0)
let columnNum = 0
if (rowsData[0]) {
columnNum = rowsData[0].ceils.length
columnNum = (rowsData[0] as any).ceils.length
} else if (header.length) {
columnNum = header.length
}