42 lines
933 B
TypeScript
42 lines
933 B
TypeScript
import { computed, toRef } from 'vue'
|
|
import { useComponentColor, useNamespace } from '@tuniao/tnui-vue3-uniapp/hooks'
|
|
|
|
import type { CSSProperties } from 'vue'
|
|
import type { TimeLineDataProps } from '../time-line-data'
|
|
|
|
export const useTimeLineDataCustomStyle = (props: TimeLineDataProps) => {
|
|
const ns = useNamespace('time-line-data')
|
|
|
|
// 解析颜色
|
|
const [dotColorClass, dotColorStyle] = useComponentColor(
|
|
toRef(props, 'dotColor'),
|
|
'text'
|
|
)
|
|
|
|
// dot对应的类
|
|
const dotClass = computed<string>(() => {
|
|
const cls: string[] = []
|
|
|
|
if (dotColorClass.value) cls.push(dotColorClass.value)
|
|
|
|
return cls.join(' ')
|
|
})
|
|
|
|
// dot样式
|
|
const dotStyle = computed<CSSProperties>(() => {
|
|
const style: CSSProperties = {}
|
|
|
|
if (!dotColorClass.value) {
|
|
style.color = dotColorStyle.value || 'var(--tn-color-red)'
|
|
}
|
|
|
|
return style
|
|
})
|
|
|
|
return {
|
|
ns,
|
|
dotClass,
|
|
dotStyle,
|
|
}
|
|
}
|