+ :style="`height: ${h - (status.header.length ? status.mergedConfig.headerHeight : 0)}px;`">
${i + 1}`
row.unshift(indexTag)
return row
})
}
- data = data.map((ceils, i) => ({ ceils, rowIndex: i }))
- const rowLength = data.length
+ dataset = dataset.map((ceils, i) => ({ ceils, rowIndex: i }))
+ const rowLength = dataset.length
if (rowLength > rowNum && rowLength < 2 * rowNum) {
- data = [...data, ...data]
+ dataset = [...dataset, ...dataset]
}
- data = data.map((d, i) => ({ ...d, scroll: i }))
+ dataset = dataset.map((d, i) => ({ ...d, scroll: i }))
- status.rowsData = data
- status.rows = data
+ status.rowsData = dataset
+ status.rows = dataset
}
const calcWidths = () => {
const { mergedConfig, rowsData } = status
const { columnWidth, header } = mergedConfig
- const usedWidth = columnWidth.reduce((all, w) => all + w, 0)
+ const usedWidth = columnWidth.reduce((all, ws) => all + ws, 0)
let columnNum = 0
if (rowsData[0]) {
columnNum = rowsData[0].ceils.length
} else if (header.length) {
columnNum = header.length
}
- const avgWidth = (w - usedWidth) / (columnNum - columnWidth.length)
+ const avgWidth = (w.value - usedWidth) / (columnNum - columnWidth.length)
const widths = new Array(columnNum).fill(avgWidth)
status.widths = merge(widths, columnWidth)
}
const calcHeights = (onresize = false) => {
const { mergedConfig, header } = status
- const { headerHeight, rowNum, data } = mergedConfig
- let allHeight = h
+ const { headerHeight, rowNum, dataset } = mergedConfig
+ let allHeight = h.value
if (header.length) allHeight -= headerHeight
const avgHeight = allHeight / rowNum
status.avgHeight = avgHeight
- if (!onresize) status.heights = new Array(data.length).fill(avgHeight)
+ if (!onresize) status.heights = new Array(dataset.length).fill(avgHeight)
}
const calcAligns = () => {
@@ -253,13 +244,13 @@ const animation = async (start = false) => {
calcHeights()
status.needCalc = false
}
-
let { avgHeight, animationIndex, mergedConfig, rowsData, updater } = status
const { waitTime, carousel, rowNum } = mergedConfig
+
const rowLength = rowsData.length
if (rowNum >= rowLength) return
if (start) {
- await new Promise(resolve => setTimeout(resolve, waitTime))
+ await new Promise(resolve => setTimeout(resolve, waitTime*1000))
if (updater !== status.updater) return
}
const animationNum = carousel === 'single' ? 1 : rowNum
@@ -274,7 +265,7 @@ const animation = async (start = false) => {
const back = animationIndex - rowLength
if (back >= 0) animationIndex = back
status.animationIndex = animationIndex
- status.animationHandler = setTimeout(animation, waitTime - 300) as any
+ status.animationHandler = setTimeout(animation, waitTime*1000 - 300) as any
}
const stopAnimation = () => {
@@ -303,19 +294,13 @@ watch(
}
)
-// watch(
-// () => rowNum.value,
-// () => {
-// onRestart()
-// }
-// )
-
// 数据更新
watch(
- () => props.chartConfig.option.dataset,
+ () => props.chartConfig.option,
() => {
onRestart()
- }
+ },
+ {deep:true}
)
// 数据更新 (默认更新 dataset，若更新之后有其它操作，可添加回调函数)
@@ -348,8 +333,6 @@ onUnmounted(() => {
font-size: 15px;
.header-item {
- .text {
- }
transition: all 0.3s;
}
}
@@ -361,15 +344,7 @@ onUnmounted(() => {
display: flex;
font-size: 14px;
transition: all 0.3s;
- }
-
- .ceil {
- // .text;
- }
-
- .index {
- border-radius: 3px;
- padding: 0px 10px;
+ overflow: hidden;
}
}
}