houzhongjian
2024-08-08 820397e43a0b64d35c6d31d2a55475061438593b
提交 | 用户 | 时间
820397 1 import { ComponentStyle, DiyComponent } from '@/components/DiyEditor/util'
H 2
3 /** 标题栏属性 */
4 export interface TitleBarProperty {
5   // 背景图
6   bgImgUrl: string
7   // 偏移
8   marginLeft: number
9   // 显示位置
10   textAlign: 'left' | 'center'
11   // 主标题
12   title: string
13   // 副标题
14   description: string
15   // 标题大小
16   titleSize: number
17   // 描述大小
18   descriptionSize: number
19   // 标题粗细
20   titleWeight: number
21   // 描述粗细
22   descriptionWeight: number
23   // 标题颜色
24   titleColor: string
25   // 描述颜色
26   descriptionColor: string
27   // 查看更多
28   more: {
29     // 是否显示查看更多
30     show: false
31     // 样式选择
32     type: 'text' | 'icon' | 'all'
33     // 自定义文字
34     text: string
35     // 链接
36     url: string
37   }
38   // 组件样式
39   style: ComponentStyle
40 }
41
42 // 定义组件
43 export const component = {
44   id: 'TitleBar',
45   name: '标题栏',
46   icon: 'material-symbols:line-start',
47   property: {
48     title: '主标题',
49     description: '副标题',
50     titleSize: 16,
51     descriptionSize: 12,
52     titleWeight: 400,
53     textAlign: 'left',
54     descriptionWeight: 200,
55     titleColor: 'rgba(50, 50, 51, 10)',
56     descriptionColor: 'rgba(150, 151, 153, 10)',
57     more: {
58       //查看更多
59       show: false,
60       type: 'icon',
61       text: '查看更多',
62       url: ''
63     },
64     style: {
65       bgType: 'color',
66       bgColor: '#fff'
67     } as ComponentStyle
68   }
69 } as DiyComponent<TitleBarProperty>