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

src/packages/components/Tables/Tables/TableScrollBoard/config.ts

@@ -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'],

src/packages/components/Tables/Tables/TableScrollBoard/config.vue

@@ -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(',')
   }
 })

src/packages/components/Tables/Tables/TableScrollBoard/data.js

@@ -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']
-]

src/packages/components/Tables/Tables/TableScrollBoard/data.json

@@ -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"]
+]

src/packages/components/Tables/Tables/TableScrollBoard/index.vue

@@ -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
   }